/* ── REFERRAL BLOCK (early + late) ──────────────────────────────────── */
.refblock{
  margin:48px 0;position:relative;overflow:hidden;
  border-radius:20px;
  background:linear-gradient(135deg,#064e3b 0%,#047857 50%,#0d9488 100%);
  color:#fff;
  box-shadow:0 24px 60px rgba(5,150,105,.32);
  padding:0;
}
.refblock::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(500px 250px at 90% 0%, rgba(255,255,255,.12), transparent 60%),
    radial-gradient(400px 200px at 10% 100%, rgba(20,184,166,.3), transparent 60%);
  pointer-events:none;
}
.refblock-inner{position:relative;padding:36px 38px;display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center}
.refblock-prize{
  flex-shrink:0;width:120px;height:120px;border-radius:16px;
  background:#fff;padding:8px;
  box-shadow:0 12px 32px rgba(0,0,0,.18);
  display:grid;place-items:center;overflow:hidden;
}
.refblock-prize img{width:100%;height:100%;object-fit:cover;border-radius:10px}
.refblock-body{min-width:0}
.refblock-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:700;
  color:#a7f3d0;margin-bottom:10px;
}
.refblock-eyebrow svg{width:12px;height:12px}
.refblock h3{
  font-family:var(--font-serif);font-weight:500;
  font-size:clamp(24px,3.5vw,32px);line-height:1.1;letter-spacing:-0.02em;
  margin:0 0 8px;color:#fff;
}
.refblock h3 em{font-style:italic;color:#fef3c7;font-weight:500}
.refblock-sub{font-size:15px;line-height:1.55;color:rgba(255,255,255,.85);margin:0 0 18px}
.refblock-sub b{color:#fff;font-weight:600}
.refblock-stats{
  display:flex;flex-wrap:wrap;gap:0;
  background:rgba(0,0,0,.18);border-radius:12px;
  padding:4px;margin-bottom:18px;
  border:1px solid rgba(255,255,255,.08);
}
.refblock-stat{flex:1;min-width:90px;padding:10px 14px;text-align:center}
.refblock-stat .val{font-family:var(--font-serif);font-weight:500;font-size:22px;line-height:1;letter-spacing:-0.02em;color:#fff;display:block;font-variant-numeric:tabular-nums}
.refblock-stat .lbl{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.65);font-weight:600;margin-top:4px;display:block}
.refblock-stat + .refblock-stat{border-left:1px solid rgba(255,255,255,.1)}

.refblock-share{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.refblock-share input{
  flex:1;min-width:200px;
  background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.16);
  color:#fff;font-size:13px;font-weight:500;
  border-radius:10px;padding:11px 14px;outline:0;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:-.01em;
}
.refblock-share input::placeholder{color:rgba(255,255,255,.45)}
.refblock-copy{
  background:#fff;color:var(--primary-deep);
  border:0;padding:11px 18px;border-radius:10px;
  font-weight:700;font-size:13px;letter-spacing:.01em;
  display:inline-flex;align-items:center;gap:8px;
  transition:transform .15s var(--ease),background .15s var(--ease);
}
.refblock-copy:hover{transform:translateY(-1px);background:#f0fdf4}
.refblock-copy.copied{background:#fef3c7;color:#854d0e}
.refblock-copy svg{width:14px;height:14px}
.refblock-share-row{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.refblock-share-btn{
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);
  color:#fff;text-decoration:none;
  padding:9px 14px;border-radius:10px;
  font-size:13px;font-weight:600;letter-spacing:.01em;
  display:inline-flex;align-items:center;gap:7px;
  transition:background .15s var(--ease),transform .15s var(--ease);
}
.refblock-share-btn:hover{background:rgba(255,255,255,.2);transform:translateY(-1px)}
.refblock-share-btn svg{width:14px;height:14px}
.refblock-fine{font-size:11.5px;color:rgba(255,255,255,.6);margin-top:14px;font-style:italic;font-family:var(--font-serif);letter-spacing:.01em}

/* "loaded" state — hide CTK-only bits until we know the visitor */
.refblock [data-ctk-only]{display:none}
.refblock.loaded [data-ctk-only]{display:block}
.refblock.loaded [data-no-ctk]{display:none}
.refblock-noctk{
  margin-top:6px;font-size:14px;color:rgba(255,255,255,.85);
  padding:14px 16px;border-radius:10px;background:rgba(0,0,0,.16);border:1px solid rgba(255,255,255,.1);
}
.refblock-noctk a{color:#fef3c7;font-weight:600;text-decoration:underline}

/* late variant — a bigger, more celebratory take */
.refblock.late .refblock-inner{grid-template-columns:1fr;text-align:center;padding:44px 40px}
.refblock.late .refblock-prize{margin:0 auto}
.refblock.late .refblock-eyebrow{justify-content:center}
.refblock.late .refblock-stats{justify-content:center}
.refblock.late .refblock-share{justify-content:center}
.refblock.late .refblock-share-row{justify-content:center}

@media (max-width:600px){
  .refblock-inner{grid-template-columns:1fr;padding:28px 24px;gap:18px;text-align:center}
  .refblock-prize{width:96px;height:96px;margin:0 auto}
  .refblock-eyebrow{justify-content:center}
  .refblock-stats{justify-content:center}
  .refblock-share input{font-size:12px}
  .refblock.late .refblock-inner{padding:32px 22px}
}