/* 2026-10-26 | Davisville Labs / mobile hero editorial product gallery.
   Only loaded at <=760px. Desktop 3-product presentation is unchanged. */
.studio-redesign .hero-stage{display:none}
.studio-redesign .mobile-featured-work{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:13px;
  width:100%;
  min-width:0;
  max-width:590px;
  margin:3px auto 0;
}
.studio-redesign .mobile-feature{
  box-sizing:border-box;
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:9px;
  width:100%;
  min-width:0;
  min-height:191px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.22);
  border-radius:18px;
  padding:18px 20px 16px;
  text-decoration:none;
  box-shadow:0 20px 40px rgba(0,6,19,.20),inset 0 1px rgba(255,255,255,.10);
  transition:transform .2s ease,border-color .2s ease;
}
.studio-redesign .mobile-feature:focus-visible{
  outline:3px solid #fff;outline-offset:4px;
}
.studio-redesign .mobile-feature:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.68);
}
.studio-redesign .mobile-feature-top{
  position:relative;z-index:2;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  width:100%;
}
.studio-redesign .mobile-feature-index{
  font:800 9px/1.35 Inter,system-ui,sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.studio-redesign .mobile-feature-brand{
  font:800 11px/1.3 Inter,system-ui,sans-serif;
  display:inline-flex;align-items:center;gap:5px;
  white-space:nowrap;
}
.studio-redesign .mobile-feature-content{
  position:relative;z-index:2;
  display:flex;flex-direction:column;gap:7px;
  align-items:flex-start;
}
.studio-redesign .mobile-feature-content strong{
  display:block;
  max-width:310px;
  font:800 clamp(24px,6.7vw,34px)/1.06 Manrope,Inter,system-ui,sans-serif;
  letter-spacing:-.052em;
  text-wrap:balance;
}
.studio-redesign .mobile-feature-description{
  display:block;
  font:500 12px/1.4 Inter,system-ui,sans-serif;
}
.studio-redesign .mobile-feature-link{
  position:relative;z-index:2;
  display:flex;align-items:center;gap:8px;
  font:800 10px/1.3 Inter,system-ui,sans-serif;
  letter-spacing:.025em;
  white-space:nowrap;
}
.studio-redesign .mobile-feature-link span{font-size:15px;line-height:1}
/* Artwork-backed first product: actual brand artwork, without UI chrome. */
.studio-redesign .mobile-feature-bitcoin{
  color:#fff;
  border-color:rgba(241,165,69,.53);
  background:
    linear-gradient(90deg,rgba(6,15,29,.99) 0%,rgba(6,15,29,.93) 31%,rgba(7,18,34,.57) 70%,rgba(7,18,34,.28)),
    url('/assets/golden-gate-night-original.avif') 66% 52%/cover no-repeat;
}
.studio-redesign .mobile-feature-bitcoin .mobile-feature-index{color:#f9ba66}
.studio-redesign .mobile-feature-bitcoin .mobile-feature-description{color:#e1e2de}
.studio-redesign .mobile-feature-bitcoin .mobile-feature-link{color:#ffc277}
.studio-redesign .mobile-bitcoin-mark{color:#ffb24d;font-size:15px;line-height:1}
/* Compass: directional visual made from its actual product glyph. */
.studio-redesign .mobile-feature-compass{
  color:#fff;
  border-color:rgba(115,151,255,.63);
  background:
    radial-gradient(ellipse at 91% 48%,rgba(105,124,240,.37) 0%,rgba(86,111,207,.15) 34%,transparent 67%),
    linear-gradient(122deg,#111d3e 0%,#182c5c 54%,#254082 100%);
}
.studio-redesign .mobile-feature-compass .mobile-feature-index{color:#afc7ff}
.studio-redesign .mobile-feature-compass .mobile-feature-brand{color:#e0eaff}
.studio-redesign .mobile-feature-compass .mobile-feature-description{color:#ceddfb}
.studio-redesign .mobile-feature-compass .mobile-feature-link{color:#a9cdff}
.studio-redesign .mobile-feature-compass .mobile-feature-content strong{
  max-width:min(58%,205px);
  font-size:clamp(23px,6.4vw,30px);
  line-height:1.08;
  text-wrap:balance;
}
.studio-redesign .mobile-feature-compass .mobile-feature-content{
  width:100%;
  min-width:0;
}
.studio-redesign .mobile-feature-compass .mobile-feature-description{
  max-width:57%;
  line-height:1.4;
}
.studio-redesign .mobile-feature-symbol{
  position:absolute;z-index:1;
  top:47px;right:7px;
  display:grid;place-items:center;
  width:143px;height:143px;border-radius:100%;
  background:radial-gradient(circle,rgba(231,234,255,.34),rgba(181,193,255,.14) 53%,transparent 71%);
  opacity:.86;
  pointer-events:none;
}
.studio-redesign .mobile-feature-symbol:before,
.studio-redesign .mobile-feature-symbol:after{
  position:absolute;inset:10px;border:1px solid rgba(189,202,255,.27);border-radius:50%;content:"";
}
.studio-redesign .mobile-feature-symbol:after{inset:27px}
.studio-redesign .mobile-feature-symbol img{width:92px;height:92px;object-fit:contain;filter:brightness(1.55) saturate(1.05) drop-shadow(0 8px 18px rgba(5,10,53,.38))}
/* Analytics: restraint + quiet telemetry motif, no fake business metrics. */
.studio-redesign .mobile-feature-analytics{
  color:#fff;
  border-color:rgba(59,155,216,.54);
  background:radial-gradient(ellipse at 85% 85%,rgba(23,111,194,.44),transparent 65%),linear-gradient(120deg,#071a31,#0b2c50 80%,#0a2548);
}
.studio-redesign .mobile-feature-analytics .mobile-feature-index{color:#83d9f0}
.studio-redesign .mobile-feature-analytics .mobile-feature-description{color:#c2d6e9}
.studio-redesign .mobile-feature-analytics .mobile-feature-link{color:#69d3f5}
.studio-redesign .mobile-feature-bars{
  position:absolute;
  right:18px;bottom:38px;
  width:124px;height:83px;
  display:flex;align-items:end;gap:6px;
  opacity:.64;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 42%);
  mask-image:linear-gradient(90deg,transparent,#000 42%);
}
.studio-redesign .mobile-feature-bars i{
  display:block;flex:1;
  border-radius:3px 3px 0 0;
  background:linear-gradient(#61d9f2,#2467c5);
  box-shadow:0 0 16px rgba(57,186,244,.18);
}
.studio-redesign .mobile-feature-bars i:nth-child(1){height:29%}
.studio-redesign .mobile-feature-bars i:nth-child(2){height:47%}
.studio-redesign .mobile-feature-bars i:nth-child(3){height:38%}
.studio-redesign .mobile-feature-bars i:nth-child(4){height:62%}
.studio-redesign .mobile-feature-bars i:nth-child(5){height:51%}
.studio-redesign .mobile-feature-bars i:nth-child(6){height:77%}
.studio-redesign .mobile-feature-bars i:nth-child(7){height:92%}
/* The old Selected Work label doesn't compete with the actual selected work. */
.studio-redesign .studio-hero .hero-bottom{display:none}
.studio-redesign .studio-hero .hero-layout{gap:24px;padding-bottom:63px}
@media(max-width:380px){
  .studio-redesign .mobile-feature{min-height:184px;padding:16px 16px 15px}
  .studio-redesign .mobile-feature-content strong{font-size:25px}
  .studio-redesign .mobile-feature-symbol{width:116px;height:116px;right:-8px}
  .studio-redesign .mobile-feature-compass .mobile-feature-content strong{max-width:57%;font-size:23px}
  .studio-redesign .mobile-feature-symbol img{width:79px;height:79px}
  .studio-redesign .mobile-feature-bars{width:108px;right:11px}
}
@media(prefers-reduced-motion:reduce){
  .studio-redesign .mobile-feature{transition:none}
  .studio-redesign .mobile-feature:hover{transform:none}
}