/* BLUE PAD — TASTE PASS 3.1 / 2026-09-04
 * Editorial archive preview, photographic cohesion, card cues and section-title motion.
 */

:root{
  --bp-t31-ease:cubic-bezier(.22,1,.36,1);
  --bp-t31-lime:#DFFF48;
  --bp-t31-ink:#05060A;
}

/* 01 — Coherent photographic treatment. Keep the effect restrained: this is an
   editorial unifier for mixed-year source photography, not a visual filter gimmick. */
:is(.bp-case-media,.bp-work-image) img,
:is(.bp-hotel,.bp-mall,.bp-v,.bp-corp,.bp-vs) article img{
  filter:saturate(.90) contrast(1.035) brightness(.97);
  transition:transform .85s var(--bp-t31-ease),filter .65s ease,opacity .45s ease;
}
@media(hover:hover) and (pointer:fine){
  :is(.bp-case,.bp-work-card):hover :is(.bp-case-media,.bp-work-image) img,
  :is(.bp-case,.bp-work-card):focus-visible :is(.bp-case-media,.bp-work-image) img,
  :is(.bp-hotel,.bp-mall,.bp-v,.bp-corp,.bp-vs) article:hover img{
    filter:saturate(1) contrast(1.02) brightness(1);
  }
}

/* 02 — Project card interaction. The cue is injected by bpwc-taste-31.js. */
:is(.bp-case,.bp-work-card){position:relative;isolation:isolate}
.bp-t31-card-cue{
  position:absolute;z-index:12;top:18px;right:18px;
  display:inline-flex;align-items:center;justify-content:center;
  min-height:34px;padding:0 13px;border-radius:999px;
  background:var(--bp-t31-lime);color:var(--bp-t31-ink)!important;
  font:900 9px/1 monospace;letter-spacing:.12em;text-transform:uppercase;
  opacity:0;transform:translateY(8px) scale(.96);
  transition:opacity .32s ease,transform .5s var(--bp-t31-ease);
  pointer-events:none;box-shadow:0 8px 28px rgba(0,0,0,.18)
}
@media(hover:hover) and (pointer:fine){
  :is(.bp-case,.bp-work-card):hover .bp-t31-card-cue,
  :is(.bp-case,.bp-work-card):focus-visible .bp-t31-card-cue{
    opacity:1;transform:none
  }
  :is(.bp-case,.bp-work-card) :is(h3,.bp-case-copy h3){
    transition:transform .55s var(--bp-t31-ease),color .3s ease
  }
  :is(.bp-case,.bp-work-card):hover :is(h3,.bp-case-copy h3){transform:translateX(3px)}
}

/* 03 — Archive cinematic preview. Uses data-img/data-title already present on all
   31 archive rows, so it remains data-driven and needs no duplicated project map. */
body:is(.page-id-4660,.page-id-4661) .bp-archive-head{z-index:3}
body:is(.page-id-4660,.page-id-4661) .bp-t31-preview{
  margin-top:18px;max-width:390px;color:#fff
}
body:is(.page-id-4660,.page-id-4661) .bp-t31-preview-meta{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  margin:0 0 9px;color:rgba(255,255,255,.46);
  font:900 9px/1.2 monospace;letter-spacing:.14em;text-transform:uppercase
}
body:is(.page-id-4660,.page-id-4661) .bp-t31-preview-frame{
  position:relative;overflow:hidden;width:100%;height:clamp(170px,15vw,220px);
  background:#0d0f16;border:1px solid rgba(255,255,255,.12);isolation:isolate
}
body:is(.page-id-4660,.page-id-4661) .bp-t31-preview-frame:after{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(180deg,transparent 45%,rgba(5,6,10,.56) 100%)
}
body:is(.page-id-4660,.page-id-4661) .bp-t31-preview-img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.055);filter:saturate(.88) contrast(1.06) brightness(.94);
  transition:opacity .48s ease,transform .9s var(--bp-t31-ease),filter .65s ease
}
body:is(.page-id-4660,.page-id-4661) .bp-t31-preview-img.is-active{
  opacity:1;transform:scale(1.01);filter:saturate(.98) contrast(1.04) brightness(.98)
}
body:is(.page-id-4660,.page-id-4661) .bp-t31-preview-cue{
  position:absolute;right:12px;bottom:12px;z-index:5;
  padding:8px 10px;border-radius:999px;background:var(--bp-t31-lime);color:var(--bp-t31-ink);
  font:900 8px/1 monospace;letter-spacing:.12em;text-transform:uppercase
}
body:is(.page-id-4660,.page-id-4661) .bp-t31-preview-title{
  margin-top:11px;font-size:clamp(18px,1.45vw,23px);font-weight:900;line-height:.98;
  letter-spacing:-.035em;text-transform:uppercase;color:#fff
}
body:is(.page-id-4660,.page-id-4661) .bp-t31-preview-tag{
  margin-top:6px;color:rgba(255,255,255,.46);
  font:800 8.5px/1.3 monospace;letter-spacing:.10em;text-transform:uppercase
}
@media(min-width:1080px){
  body:is(.page-id-4660,.page-id-4661) .bp-archive-row{
    transition:padding-left .45s var(--bp-t31-ease),background .3s ease,border-color .3s ease!important
  }
  body:is(.page-id-4660,.page-id-4661) .bp-archive-row:hover,
  body:is(.page-id-4660,.page-id-4661) .bp-archive-row:focus-within{
    background:linear-gradient(90deg,rgba(223,255,72,.035),transparent 72%)
  }
}
@media(min-width:1280px){
  body:is(.page-id-4660,.page-id-4661) .bp-archive-head{
    top:92px!important
  }
  body.admin-bar:is(.page-id-4660,.page-id-4661) .bp-archive-head{
    top:124px!important
  }
  body:is(.page-id-4660,.page-id-4661) .bp-archive-head h2{
    font-size:clamp(54px,5.2vw,86px)!important;line-height:.82!important
  }
  body:is(.page-id-4660,.page-id-4661) .bp-archive-head p{
    margin:18px 0 0!important;font-size:15px!important;line-height:1.5!important
  }
  body:is(.page-id-4660,.page-id-4661) .bp-archive-head:after{
    display:none!important
  }
}
@media(max-width:1279px){
  body:is(.page-id-4660,.page-id-4661) .bp-t31-preview{display:none!important}
}

/* 04 — Persistent Home navigation + restored WE BUILD access. */
.bp-nav.bp-t31-nav-guard{
  position:fixed!important;z-index:2147483000!important;visibility:visible!important;
  opacity:1!important;display:flex!important;pointer-events:auto!important;overflow:visible!important
}
.bp-nav.bp-t31-nav-guard .bp-navlinks{overflow:visible!important}
.bp-t31-build{position:relative;display:flex;align-items:center}
.bp-t31-build:after{content:'';position:absolute;left:0;right:0;top:100%;height:10px;pointer-events:auto}
.bp-t31-build-trigger{
  appearance:none;border:0;background:transparent;color:inherit;cursor:pointer;
  padding:11px 15px;border-radius:13px;font:inherit;letter-spacing:inherit;text-transform:inherit;
  opacity:.80;transition:opacity .2s ease,background .2s ease,transform .2s ease
}
.bp-t31-build-trigger span{color:var(--bp-t31-lime);margin-left:3px}
.bp-t31-build-trigger:hover,.bp-t31-build-trigger:focus-visible,.bp-t31-build.is-open .bp-t31-build-trigger{
  opacity:1;background:rgba(255,255,255,.08);transform:translateY(-1px);outline:none
}
.bp-t31-build-panel{
  position:absolute;z-index:2147483001;top:calc(100% + 7px);right:0;width:min(460px,calc(100vw - 32px));
  display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:8px;border-radius:16px;
  border:1px solid rgba(255,255,255,.13);background:linear-gradient(180deg,rgba(13,15,23,.98),rgba(5,6,10,.98));
  box-shadow:0 24px 80px rgba(0,0,0,.38);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-6px) scale(.985);
  transition:opacity .2s ease,visibility .2s ease,transform .3s var(--bp-t31-ease)
}
.bp-t31-build-panel a{
  display:flex!important;align-items:center;min-height:46px;padding:11px 12px!important;border-radius:10px;
  color:#fff!important;opacity:.78!important;text-shadow:none!important;text-decoration:none!important;
  font-size:10px!important;line-height:1.25!important;letter-spacing:.08em!important
}
.bp-t31-build-panel a:hover,.bp-t31-build-panel a:focus-visible{
  opacity:1!important;background:rgba(223,255,72,.10)!important;color:#fff!important;transform:none!important;outline:none
}
.bp-t31-build:hover .bp-t31-build-panel,.bp-t31-build:focus-within .bp-t31-build-panel,.bp-t31-build.is-open .bp-t31-build-panel{
  opacity:1;visibility:visible;pointer-events:auto;transform:none
}
.bp-nav.bp-nav-light .bp-t31-build-trigger{color:#090B11}
.bp-nav.bp-nav-light .bp-t31-build-trigger:hover,.bp-nav.bp-nav-light .bp-t31-build-trigger:focus-visible,.bp-nav.bp-nav-light .bp-t31-build.is-open .bp-t31-build-trigger{
  background:rgba(9,11,17,.065)
}
body.bp-experience-engine .bp-nav.bp-nav-light .bp-navlinks .bp-t31-build-panel a,
body.page-id-5 .bp-nav.bp-nav-light .bp-navlinks .bp-t31-build-panel a,
body.page-id-4649 .bp-nav.bp-nav-light .bp-navlinks .bp-t31-build-panel a{
  color:#fff!important;opacity:.82!important;text-shadow:none!important
}
body.bp-experience-engine .bp-nav.bp-nav-light .bp-navlinks .bp-t31-build-panel a:hover,
body.bp-experience-engine .bp-nav.bp-nav-light .bp-navlinks .bp-t31-build-panel a:focus-visible,
body.page-id-5 .bp-nav.bp-nav-light .bp-navlinks .bp-t31-build-panel a:hover,
body.page-id-5 .bp-nav.bp-nav-light .bp-navlinks .bp-t31-build-panel a:focus-visible,
body.page-id-4649 .bp-nav.bp-nav-light .bp-navlinks .bp-t31-build-panel a:hover,
body.page-id-4649 .bp-nav.bp-nav-light .bp-navlinks .bp-t31-build-panel a:focus-visible{
  color:#fff!important;opacity:1!important
}

/* Shared navbar: use the same existing WE BUILD control without changing the shell design. */
.bp-site-nav2 .bp-t31-build-trigger{
  min-height:34px;padding:10px 12px;border-radius:11px;
  font:800 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.10em;text-transform:uppercase
}
.bp-site-nav2 .bp-t31-build-panel{right:0}
body .bp-site-nav2 .bp-t31-build-panel a{color:#fff!important;opacity:.82!important}
body .bp-site-nav2 .bp-t31-build-panel a:hover,body .bp-site-nav2 .bp-t31-build-panel a:focus-visible{color:#fff!important;opacity:1!important}
@media(max-width:640px){
  .bp-site-nav2 .bp-t31-build-trigger{min-height:30px;padding:7px 5px;font-size:8px;letter-spacing:.04em}
}

/* 05 — Retire the global H2 reveal from 3.1. These rules also recover any stale class
   left in a browser tab that loaded the first 3.1 build. */
.bp-t31-title,.bp-t31-title.is-t31-in{
  opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important;will-change:auto!important
}

@media(max-width:700px){
  .bp-t31-card-cue{top:12px;right:12px;min-height:30px;padding:0 10px;font-size:8px}
}
@media(prefers-reduced-motion:reduce){
  .bp-t31-title,.bp-t31-title.is-t31-in{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
  .bp-t31-preview-img,.bp-t31-card-cue{transition:none!important;transform:none!important}
}