/* ===== BALLSY.TV · 3D GLOSS LAYER · ballsy-3d-sep20 ===== */
/* Add-only. Sits on top of every existing page. Nothing below it is changed. */

/* --- expensive: gold sheen sweep on anything that looks like a button --- */
.bz3-sheen{position:relative;overflow:hidden;isolation:isolate}
.bz3-sheen::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.42) 50%,transparent 65%);
  transform:translateX(-140%);transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
.bz3-sheen:hover::after{transform:translateX(140%)}

/* --- depth: cards tilt toward the cursor (desktop only, set by JS) --- */
.bz3-tilt{transition:transform .7s cubic-bezier(.16,1,.3,1),box-shadow .7s cubic-bezier(.16,1,.3,1);will-change:transform;transform-style:preserve-3d}
.bz3-tilt.bz3-live{transition:transform .1s linear,box-shadow .7s cubic-bezier(.16,1,.3,1)}
.bz3-tilt.bz3-live{box-shadow:0 40px 90px rgba(0,0,0,.45),0 0 0 1px rgba(244,201,93,.35)!important}
.bz3-stage{perspective:1400px}

/* --- depth: headline parallax --- */
.bz3-para{will-change:transform}

/* --- midnight star field behind everything (desktop) --- */
#bz3Stars{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.55;mix-blend-mode:screen}
@media (max-width:920px){#bz3Stars{display:none}}

/* --- THE MIDNIGHT HOUR doorway band --- */
.bz3-door{position:relative;z-index:2;margin:clamp(28px,4vw,64px) 0;padding:clamp(34px,5vw,72px) clamp(18px,5vw,72px);overflow:hidden;
  background:
    radial-gradient(70% 60% at 82% 20%,rgba(244,201,93,.45),rgba(244,201,93,0) 60%),
    radial-gradient(120% 80% at 50% 120%,#ff9a5c 0%,rgba(255,154,92,0) 55%),
    linear-gradient(180deg,#12041f 0%,#3a1266 40%,#7a2fb5 75%,#b04ce8 100%);
  color:#fff;font-family:"Poppins",system-ui,sans-serif}
.bz3-door::before,.bz3-door::after{content:"";position:absolute;left:0;right:0;height:clamp(10px,2vw,22px);background:#0b0410}
.bz3-door::before{top:0}.bz3-door::after{bottom:0}
.bz3-door .moon{position:absolute;right:clamp(20px,8vw,120px);top:clamp(30px,6vw,70px);width:clamp(70px,9vw,130px);height:clamp(70px,9vw,130px);border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#fff8e0,#f4c95d 60%,#c9962a);box-shadow:0 0 80px rgba(244,201,93,.8),0 0 160px rgba(244,201,93,.4);animation:bz3Moon 7s ease-in-out infinite}
@keyframes bz3Moon{50%{transform:translateY(-10px)}}
.bz3-door .sea{position:absolute;left:0;right:0;bottom:0;height:34%;background:linear-gradient(180deg,rgba(18,4,31,0),rgba(18,4,31,.55));
  -webkit-mask:repeating-linear-gradient(180deg,#000 0 3px,transparent 3px 7px);mask:repeating-linear-gradient(180deg,#000 0 3px,transparent 3px 7px)}
.bz3-door .in{position:relative;z-index:1;max-width:1180px;margin:0 auto}
.bz3-door .k{display:inline-block;font-family:"Anton",Impact,sans-serif;font-size:12px;letter-spacing:.32em;text-transform:uppercase;background:#f4c95d;color:#0b0410;padding:8px 14px 7px;transform:rotate(-2deg)}
.bz3-door h2{font-family:"Anton",Impact,"Arial Narrow",sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(44px,8vw,128px);line-height:.88;margin:.25em 0 .2em;color:#0b0410;letter-spacing:.005em;
  text-shadow:1px 1px 0 #2a0a4a,2px 2px 0 #2a0a4a,3px 3px 0 #2a0a4a,4px 4px 0 #2a0a4a,5px 5px 0 #2a0a4a,6px 6px 0 #2a0a4a,14px 18px 40px rgba(0,0,0,.5)}
.bz3-door h2 .w{color:#fff}.bz3-door h2 .g{color:#f4c95d}
.bz3-door h2 .sq{display:inline-block;width:.16em;height:.16em;background:#fff;margin-left:.06em;box-shadow:0 0 30px rgba(255,255,255,.7)}
.bz3-door p{font-size:clamp(17px,1.8vw,23px);line-height:1.45;font-weight:600;max-width:36ch;margin:0 0 26px;text-shadow:0 2px 20px rgba(0,0,0,.4)}
.bz3-door p em{font-style:normal;color:#f4c95d}
.bz3-door .cta{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-family:"Anton",Impact,sans-serif;text-transform:uppercase;letter-spacing:.08em;font-size:clamp(16px,1.5vw,20px);
  padding:18px 30px 16px;border-radius:999px;background:#f4c95d;color:#0b0410;box-shadow:0 18px 50px rgba(244,201,93,.35);transition:transform .5s cubic-bezier(.16,1,.3,1)}
.bz3-door .cta:hover{transform:translateY(-3px) scale(1.02)}
.bz3-door .cta .sq{width:.5em;height:.5em;background:currentColor;display:inline-block}
.bz3-door .cta.alt{background:#0b0410;color:#fff;box-shadow:0 18px 50px rgba(0,0,0,.45);margin-left:10px}
.bz3-door .uniq{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.bz3-door .uniq span{font-family:"Anton",Impact,sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase;border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:8px 14px 7px;background:rgba(11,4,16,.35)}
.bz3-door .uniq span b{color:#f4c95d;font-weight:400}
@media (max-width:640px){.bz3-door .moon{width:56px;height:56px;top:26px;right:18px}.bz3-door .cta.alt{margin-left:0;margin-top:10px}}

/* --- nav pill --- */
.bz3-nav{display:inline-flex!important;align-items:center;gap:6px;text-decoration:none!important;font-family:"Anton",Impact,sans-serif!important;text-transform:uppercase;letter-spacing:.1em;font-size:13px!important;
  background:#0b0410!important;color:#f4c95d!important;border-radius:999px;padding:8px 14px 7px!important;box-shadow:0 0 0 1px #f4c95d inset,0 0 24px rgba(244,201,93,.35);margin-left:6px;vertical-align:middle;white-space:nowrap}
.bz3-nav i{width:8px;height:8px;border-radius:50%;background:#f4c95d;box-shadow:0 0 10px #f4c95d;display:inline-block;animation:bz3Blink 1.6s infinite}
@keyframes bz3Blink{50%{opacity:.25}}

/* --- FILED UNDER: crawlable tag index, visible, on brand --- */
.bz3-tags{position:relative;z-index:2;background:#0b0410;color:#fff;padding:clamp(28px,4vw,54px) clamp(18px,5vw,72px) clamp(30px,4vw,60px);font-family:"Poppins",system-ui,sans-serif;border-top:2px solid #f4c95d}
.bz3-tags .in{max-width:1180px;margin:0 auto}
.bz3-tags h2{font-family:"Anton",Impact,sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(22px,2.6vw,36px);letter-spacing:.04em;margin:0 0 6px;color:#fff}
.bz3-tags h2 .sq{display:inline-block;width:.18em;height:.18em;background:#f4c95d;margin-left:.08em}
.bz3-tags .lead{font-size:14px;color:rgba(255,255,255,.75);margin:0 0 18px;max-width:70ch}
.bz3-tags h3{font-family:"Anton",Impact,sans-serif;font-weight:400;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#f4c95d;margin:18px 0 8px}
.bz3-tags ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.bz3-tags li a{display:inline-block;font-size:11.5px;font-weight:600;letter-spacing:.02em;text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:5px 10px 4px;background:rgba(122,47,181,.22);transition:background .3s,border-color .3s,transform .3s}
.bz3-tags li a:hover{background:#7a2fb5;border-color:#f4c95d;transform:translateY(-1px)}
.bz3-tags .line{margin-top:22px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.bz3-tags .line a{color:#f4c95d;text-decoration:none}

@media (prefers-reduced-motion:reduce){
  .bz3-sheen::after,.bz3-door .moon,.bz3-nav i{animation:none!important;transition:none!important}
  .bz3-tilt{transform:none!important}
  #bz3Stars{display:none}
}

/* ===== SEP 21 · SPAIN LAYER · flags, postcards, journey map, dock fix ===== */
/* CSS Spanish flag: red / yellow / red, no image needed */
.bz-flag{display:inline-block;width:1.5em;height:1em;vertical-align:-.15em;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.35);
  background:linear-gradient(180deg,#c60b1e 0 25%,#ffc400 25% 75%,#c60b1e 75% 100%)}
.bz-flag.big{width:2.4em;height:1.6em;border-radius:3px}

/* postcards from Spain */
.bz3-post{position:relative;z-index:2;padding:clamp(34px,5vw,72px) clamp(18px,5vw,72px);background:
  radial-gradient(90% 60% at 10% 0%,rgba(255,154,92,.35),rgba(255,154,92,0) 60%),
  linear-gradient(180deg,#2a0a4a,#7a2fb5 60%,#b04ce8);color:#fff;font-family:"Poppins",system-ui,sans-serif;overflow:hidden}
.bz3-post .in{max-width:1180px;margin:0 auto}
.bz3-post .k{display:inline-flex;align-items:center;gap:10px;font-family:"Anton",Impact,sans-serif;font-size:12px;letter-spacing:.32em;text-transform:uppercase;background:#0b0410;color:#f4c95d;padding:8px 14px 7px;transform:rotate(-2deg)}
.bz3-post h2{font-family:"Anton",Impact,"Arial Narrow",sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(40px,7vw,110px);line-height:.88;margin:.25em 0 .15em;color:#0b0410;letter-spacing:.005em;text-shadow:1px 1px 0 #2a0a4a,2px 2px 0 #2a0a4a,3px 3px 0 #2a0a4a,4px 4px 0 #2a0a4a,10px 14px 34px rgba(0,0,0,.45)}
.bz3-post h2 .w{color:#fff}.bz3-post h2 .g{color:#f4c95d}
.bz3-post h2 .sq{display:inline-block;width:.16em;height:.16em;background:#fff;margin-left:.06em}
.bz3-post p.sub{font-size:clamp(16px,1.6vw,21px);font-weight:600;max-width:40ch;margin:0 0 26px;text-shadow:0 2px 20px rgba(0,0,0,.4)}
.bz3-post p.sub em{font-style:normal;color:#f4c95d}
.bz3-post .grid{display:grid;gap:clamp(12px,1.8vw,22px);grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.bz3-post .card{position:relative;aspect-ratio:4/5;border-radius:16px;overflow:hidden;background:#12041f;box-shadow:0 26px 60px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.12) inset;text-decoration:none;color:#fff;display:block;transform:rotate(var(--r,0deg));transition:transform .7s cubic-bezier(.16,1,.3,1),box-shadow .7s}
.bz3-post .card:hover{transform:rotate(0) translateY(-6px) scale(1.02);box-shadow:0 46px 100px rgba(0,0,0,.6),0 0 0 1px #f4c95d inset}
.bz3-post .card .ph{position:absolute;inset:0;background-size:cover;background-position:center;background-image:linear-gradient(160deg,#7a2fb5,#2a0a4a);filter:saturate(1.15) contrast(1.06);transform:scale(1.06);transition:transform 1.4s cubic-bezier(.16,1,.3,1)}
.bz3-post .card:hover .ph{transform:scale(1.14)}
.bz3-post .card .grade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,4,31,.05) 0%,rgba(18,4,31,0) 35%,rgba(42,10,74,.5) 65%,rgba(11,4,16,.95) 100%)}
.bz3-post .card .bars{position:absolute;left:0;right:0;height:6%;background:#0b0410}.bz3-post .card .bars.t{top:0}.bz3-post .card .bars.b{bottom:0}
.bz3-post .card .sc{position:absolute;top:calc(6% + 10px);left:12px;font-family:"Anton",Impact,sans-serif;font-size:10px;letter-spacing:.26em;color:#0b0410;background:#f4c95d;padding:5px 8px 4px}
.bz3-post .card .fl{position:absolute;top:calc(6% + 10px);right:12px}
.bz3-post .card .name{position:absolute;left:14px;right:14px;bottom:calc(6% + 12px)}
.bz3-post .card .name h3{font-family:"Anton",Impact,sans-serif;font-size:clamp(24px,2.6vw,36px);line-height:.92;margin:0 0 6px;text-transform:uppercase;text-shadow:0 6px 30px rgba(0,0,0,.6)}
.bz3-post .card .name p{margin:0;font-size:12.5px;line-height:1.35;color:rgba(255,255,255,.9);font-weight:500}
.bz3-post .stamp{position:absolute;right:clamp(10px,4vw,60px);top:clamp(14px,3vw,40px);width:clamp(84px,10vw,140px);height:clamp(84px,10vw,140px);border-radius:50%;border:3px solid #f4c95d;color:#f4c95d;display:grid;place-items:center;text-align:center;font-family:"Anton",Impact,sans-serif;font-size:clamp(10px,1vw,13px);letter-spacing:.14em;line-height:1.15;transform:rotate(10deg);text-transform:uppercase;box-shadow:0 0 30px rgba(244,201,93,.35);background:rgba(11,4,16,.35)}
.bz3-post .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.bz3-post .cta{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-family:"Anton",Impact,sans-serif;text-transform:uppercase;letter-spacing:.08em;font-size:clamp(15px,1.4vw,19px);padding:16px 26px 14px;border-radius:999px;background:#f4c95d;color:#0b0410;box-shadow:0 18px 50px rgba(244,201,93,.35)}
.bz3-post .cta.alt{background:#0b0410;color:#fff;box-shadow:0 18px 50px rgba(0,0,0,.45)}
@media (max-width:640px){.bz3-post .stamp{display:none}}

/* journey map: route rail under the nav */
.bz3-route{position:relative;z-index:3;background:#0b0410;color:#fff;font-family:"Poppins",system-ui,sans-serif;border-top:1px solid rgba(244,201,93,.35);border-bottom:1px solid rgba(244,201,93,.35);overflow-x:auto;-webkit-overflow-scrolling:touch}
.bz3-route .in{display:flex;align-items:center;gap:0;max-width:1180px;margin:0 auto;padding:0 clamp(12px,3vw,40px);min-width:max-content}
.bz3-route .lab{font-family:"Anton",Impact,sans-serif;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#f4c95d;padding:12px 16px 12px 0;white-space:nowrap;display:inline-flex;align-items:center;gap:8px}
.bz3-route a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:rgba(255,255,255,.85);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:12px 14px;white-space:nowrap;position:relative}
.bz3-route a b{font-family:"Anton",Impact,sans-serif;font-weight:400;color:#f4c95d;font-size:12px}
.bz3-route a::after{content:"→";margin-left:10px;color:rgba(255,255,255,.35)}
.bz3-route a:last-child::after{content:""}
.bz3-route a.here{color:#0b0410;background:#f4c95d;border-radius:999px;margin:6px 4px}
.bz3-route a.here b{color:#0b0410}
.bz3-route a.here::before{content:"YOU ARE HERE";position:absolute;top:-7px;left:12px;font-size:8px;letter-spacing:.2em;background:#0b0410;color:#f4c95d;padding:2px 6px;border-radius:999px}
.bz3-route a:hover{color:#f4c95d}

/* next stop band */
.bz3-next{position:relative;z-index:2;background:#0b0410;color:#fff;padding:clamp(28px,4vw,56px) clamp(18px,5vw,72px);font-family:"Poppins",system-ui,sans-serif;border-top:2px solid #f4c95d}
.bz3-next .in{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center}
.bz3-next .k{font-family:"Anton",Impact,sans-serif;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:#f4c95d;display:inline-flex;align-items:center;gap:8px}
.bz3-next h2{font-family:"Anton",Impact,"Arial Narrow",sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(30px,4.5vw,64px);line-height:.92;margin:8px 0 6px;color:#fff}
.bz3-next h2 .g{color:#f4c95d}
.bz3-next p{margin:0;font-size:15px;color:rgba(255,255,255,.8);max-width:52ch}
.bz3-next .cta{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-family:"Anton",Impact,sans-serif;text-transform:uppercase;letter-spacing:.08em;font-size:clamp(15px,1.4vw,19px);padding:16px 26px 14px;border-radius:999px;background:#f4c95d;color:#0b0410;box-shadow:0 18px 50px rgba(244,201,93,.35);white-space:nowrap}
@media (max-width:700px){.bz3-next .in{grid-template-columns:1fr}}

/* dock fix: the two floating pills were overlapping; give them their own lanes on every screen */
html body .wa-float{bottom:calc(var(--bzd-bar,56px) + var(--bzd-gap,10px) + 66px + var(--bzd-gap,10px) + var(--bzd-safe,0px)) !important}
@media (max-width:760px){
  html body .wa-float{bottom:calc(var(--bzd-bar,56px) + var(--bzd-gap,10px) + 58px + var(--bzd-gap,10px) + var(--bzd-safe,0px)) !important}
}

/* the Ballsy tapas menu: cast as small plates */
.bz3-tapas{position:relative;z-index:2;padding:clamp(34px,5vw,72px) clamp(18px,5vw,72px);background:linear-gradient(180deg,#0b0410,#2a0a4a 60%,#3a1266);color:#fff;font-family:"Poppins",system-ui,sans-serif}
.bz3-tapas .in{max-width:1180px;margin:0 auto}
.bz3-tapas .k{display:inline-flex;align-items:center;gap:10px;font-family:"Anton",Impact,sans-serif;font-size:12px;letter-spacing:.32em;text-transform:uppercase;background:#f4c95d;color:#0b0410;padding:8px 14px 7px;transform:rotate(-2deg)}
.bz3-tapas h2{font-family:"Anton",Impact,"Arial Narrow",sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(40px,7vw,110px);line-height:.88;margin:.25em 0 .15em;color:#fff;letter-spacing:.005em}
.bz3-tapas h2 .w{color:#b04ce8}.bz3-tapas h2 .g{color:#f4c95d}
.bz3-tapas h2 .sq{display:inline-block;width:.16em;height:.16em;background:#fff;margin-left:.06em}
.bz3-tapas p.sub{font-size:clamp(16px,1.6vw,21px);font-weight:600;max-width:44ch;margin:0 0 26px;color:rgba(255,255,255,.9)}
.bz3-tapas .menu{background:#fff8ec;color:#0b0410;border-radius:18px;padding:clamp(14px,2vw,26px);box-shadow:0 40px 90px rgba(0,0,0,.5);background-image:repeating-linear-gradient(0deg,rgba(0,0,0,.03) 0 1px,transparent 1px 28px)}
.bz3-tapas .dish{display:grid;grid-template-columns:76px 1fr auto;gap:16px;align-items:center;padding:14px 8px;border-bottom:2px dotted rgba(11,4,16,.25);text-decoration:none;color:#0b0410;transition:background .3s}
.bz3-tapas .dish:last-child{border-bottom:0}
.bz3-tapas .dish:hover{background:rgba(244,201,93,.25)}
.bz3-tapas .plate{width:76px;height:76px;border-radius:50%;background-size:cover;background-position:center 20%;box-shadow:0 0 0 4px #fff,0 0 0 6px #f4c95d,0 12px 30px rgba(0,0,0,.35);display:block}
.bz3-tapas .txt{display:flex;flex-direction:column;gap:2px}
.bz3-tapas .txt b{font-family:"Anton",Impact,sans-serif;font-weight:400;font-size:clamp(20px,2.2vw,30px);text-transform:uppercase;letter-spacing:.02em;line-height:1}
.bz3-tapas .txt i{font-style:normal;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:#7a2fb5;font-weight:700}
.bz3-tapas .txt small{font-size:14px;line-height:1.4;color:#3a2a44}
.bz3-tapas .price{font-family:"Anton",Impact,sans-serif;font-size:clamp(24px,2.6vw,36px);text-align:right;line-height:1}
.bz3-tapas .price em{display:block;font-style:normal;font-family:"Poppins",sans-serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#7a2fb5;margin-top:4px}
.bz3-tapas .rules{margin:20px 0 0;font-size:13px;line-height:1.7;color:rgba(255,255,255,.85)}
.bz3-tapas .rules b{color:#f4c95d;font-weight:700}
@media (max-width:640px){.bz3-tapas .dish{grid-template-columns:56px 1fr;gap:12px}.bz3-tapas .plate{width:56px;height:56px}.bz3-tapas .price{grid-column:2;text-align:left;display:flex;gap:10px;align-items:baseline}}

/* never let an older reveal script hide these blocks */
html body .bz3-route,html body .bz3-post,html body .bz3-tapas,html body .bz3-next,html body .bz3-door,html body .bz3-tags{opacity:1!important;visibility:visible!important;transform:none!important}
@media (max-width:760px){.bz3-route .in{padding-right:130px}}