/* ============================================================
   CodebyCarter — concept-board.css
   Rebuilt Wall of Work cards. Each one a recognizable mini-site
   preview with browser chrome + industry-themed mock content.
   Replaces the old abstract SVG-bar look.
   ============================================================ */

/* === Card chrome === */
.wow-chrome{
  display:flex;align-items:center;gap:4px;
  padding:6px 8px;
  background:rgba(0,0,0,.40);
  border-bottom:1px solid rgba(255,255,255,.06);
  flex-shrink:0;
}
.wow-chrome span{
  width:6px;height:6px;border-radius:50%;
  background:rgba(255,255,255,.20);
}
.wow-chrome span:nth-child(1){background:#EB6A5C}
.wow-chrome span:nth-child(2){background:#F6BB3F}
.wow-chrome span:nth-child(3){background:#67C657}
.wow-chrome-url{
  margin-left:6px;flex:1;
  background:rgba(255,255,255,.05);
  border-radius:3px;padding:2px 7px;
  font-family:'JetBrains Mono',monospace;
  font-size:8.5px;color:rgba(255,255,255,.55);
  letter-spacing:.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* === Card body — replaces .wow-car-stage === */
.wow-mock{
  aspect-ratio:16/10;
  display:flex;flex-direction:column;
  padding:14px 16px 12px;
  position:relative;overflow:hidden;
  font-family:'Helvetica',Arial,sans-serif;
}
.wow-mock-nav{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:8px;
}
.wow-mock-logo{
  font-weight:800;letter-spacing:-.01em;
  font-size:9.5px;line-height:1;
  white-space:nowrap;
}
.wow-mock-menu{
  display:flex;gap:5px;
  font-size:6.5px;font-weight:600;
  letter-spacing:.04em;
  color:rgba(255,255,255,.50);
}
.wow-mock-body{
  flex:1;display:flex;flex-direction:column;justify-content:center;
}
.wow-mock-h{
  font-size:14px;line-height:1.05;letter-spacing:-.02em;
  font-weight:800;margin-bottom:5px;
}
.wow-mock-p{
  font-size:7.5px;line-height:1.4;
  color:rgba(255,255,255,.55);
  margin-bottom:8px;
  max-width:24ch;
}
.wow-mock-cta{
  display:inline-block;align-self:flex-start;
  padding:4px 10px;border-radius:4px;
  font-size:7.5px;font-weight:700;letter-spacing:.04em;
  white-space:nowrap;
}

/* ============================================================
   PER-INDUSTRY VARIANTS
   ============================================================ */

/* Café */
.wow-mock--cafe{background:linear-gradient(165deg,#3B1D08 0%,#1A0E04 100%);color:#FED7AA}
.wow-mock--cafe .wow-mock-logo{color:#FED7AA;font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;font-size:11px}
.wow-mock--cafe .wow-mock-menu{color:#FED7AA;opacity:.55}
.wow-mock--cafe .wow-mock-h{font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;color:#FED7AA;font-size:15px}
.wow-mock--cafe .wow-mock-cta{background:#FED7AA;color:#3B1D08}

/* Outdoor gear */
.wow-mock--outdoor{background:linear-gradient(165deg,#0A2E2A 0%,#051917 100%);color:#A3E635}
.wow-mock--outdoor .wow-mock-logo{color:#A3E635;text-transform:uppercase;letter-spacing:.10em;font-size:8.5px}
.wow-mock--outdoor .wow-mock-menu{color:rgba(163,230,53,.55)}
.wow-mock--outdoor .wow-mock-h{color:#FAFAF7;text-transform:uppercase;letter-spacing:-.005em}
.wow-mock--outdoor .wow-mock-cta{background:#A3E635;color:#051917;text-transform:uppercase}

/* Photography */
.wow-mock--photo{background:linear-gradient(165deg,#1A0F08 0%,#0A0604 100%);color:#FB923C;position:relative}
.wow-mock--photo::before{
  content:"";position:absolute;top:30%;right:-10%;width:60%;height:60%;
  background:radial-gradient(circle,rgba(251,146,60,.35),transparent 70%);
  filter:blur(14px);
}
.wow-mock--photo .wow-mock-logo{color:#FB923C;font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;font-size:13px;letter-spacing:-.02em}
.wow-mock--photo .wow-mock-menu{color:rgba(251,146,60,.55)}
.wow-mock--photo .wow-mock-h{font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;color:#FAFAF7;font-size:16px}
.wow-mock--photo .wow-mock-cta{background:#FB923C;color:#0A0604}

/* Finance */
.wow-mock--finance{background:linear-gradient(165deg,#0A0F1F 0%,#050813 100%);color:#A78BFA}
.wow-mock--finance .wow-mock-logo{color:#FAFAF7;font-weight:300;letter-spacing:.18em;text-transform:uppercase;font-size:8.5px}
.wow-mock--finance .wow-mock-menu{color:rgba(167,139,250,.50)}
.wow-mock--finance .wow-mock-h{color:#FAFAF7;font-weight:300;letter-spacing:-.015em}
.wow-mock--finance .wow-mock-cta{background:transparent;color:#A78BFA;border:1px solid #A78BFA;padding:3px 9px;letter-spacing:.10em;text-transform:uppercase;font-weight:600}

/* Bakery */
.wow-mock--bakery{background:linear-gradient(165deg,#1F1408 0%,#0F0A05 100%);color:#FCD34D}
.wow-mock--bakery .wow-mock-logo{color:#FCD34D;font-family:'Instrument Serif',serif;font-style:italic;font-weight:400;font-size:12px}
.wow-mock--bakery .wow-mock-menu{color:rgba(252,211,77,.55)}
.wow-mock--bakery .wow-mock-h{color:#FAFAF7;font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;font-size:15px}
.wow-mock--bakery .wow-mock-cta{background:#FCD34D;color:#1F1408}

/* Travel */
.wow-mock--travel{background:linear-gradient(165deg,#1F0A1F 0%,#0F050F 100%);color:#F0ABFC}
.wow-mock--travel .wow-mock-logo{color:#F0ABFC;font-weight:700;letter-spacing:-.005em;font-size:10px}
.wow-mock--travel .wow-mock-menu{color:rgba(240,171,252,.55)}
.wow-mock--travel .wow-mock-h{color:#FAFAF7;font-weight:700}
.wow-mock--travel .wow-mock-cta{background:linear-gradient(135deg,#F0ABFC,#EC4899);color:#0F050F}

/* Salon */
.wow-mock--salon{background:linear-gradient(165deg,#FCE7F3 0%,#FBCFE8 100%);color:#831843}
.wow-mock--salon .wow-mock-logo{color:#831843;font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;font-size:13px;letter-spacing:-.02em}
.wow-mock--salon .wow-mock-menu{color:rgba(131,24,67,.55)}
.wow-mock--salon .wow-mock-h{color:#581C3E;font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;font-size:14px}
.wow-mock--salon .wow-mock-cta{background:#831843;color:#FCE7F3;border-radius:99px}

/* Plumbing / Trades */
.wow-mock--trades{background:#1E40AF;color:#FFFBEB}
.wow-mock--trades .wow-mock-logo{color:#FFFBEB;font-weight:900;letter-spacing:-.005em;font-size:10px}
.wow-mock--trades .wow-mock-menu{color:rgba(255,251,235,.65)}
.wow-mock--trades .wow-mock-h{color:#FFFBEB;font-weight:900;text-transform:uppercase}
.wow-mock--trades .wow-mock-cta{background:#F59E0B;color:#1E40AF}

/* Legal */
.wow-mock--legal{background:linear-gradient(165deg,#0A0F1F 0%,#080A14 100%);color:#94A3B8}
.wow-mock--legal .wow-mock-logo{color:#FAFAF7;font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;font-size:13px}
.wow-mock--legal .wow-mock-menu{color:rgba(148,163,184,.55)}
.wow-mock--legal .wow-mock-h{color:#FAFAF7;font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;font-size:15px;letter-spacing:-.015em}
.wow-mock--legal .wow-mock-cta{background:#FAFAF7;color:#0A0F1F;letter-spacing:.04em;font-weight:700}

/* Realty */
.wow-mock--realty{background:linear-gradient(165deg,#FAF7F2 0%,#F0E5D5 100%);color:#5A4318}
.wow-mock--realty .wow-mock-logo{color:#5A4318;font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;font-size:13px}
.wow-mock--realty .wow-mock-menu{color:rgba(90,67,24,.55)}
.wow-mock--realty .wow-mock-h{color:#3F2F0F;font-style:italic;font-family:'Instrument Serif',serif;font-weight:400;font-size:14px}
.wow-mock--realty .wow-mock-cta{background:#5A4318;color:#FAF7F2}

/* Wellness */
.wow-mock--wellness{background:linear-gradient(165deg,#0F2027 0%,#091016 100%);color:#5BE0FA}
.wow-mock--wellness .wow-mock-logo{color:#5BE0FA;letter-spacing:.16em;text-transform:uppercase;font-weight:300;font-size:8px}
.wow-mock--wellness .wow-mock-menu{color:rgba(91,224,250,.45)}
.wow-mock--wellness .wow-mock-h{color:#FAFAF7;font-weight:300;letter-spacing:-.015em}
.wow-mock--wellness .wow-mock-cta{background:transparent;color:#5BE0FA;border:1px solid rgba(91,224,250,.45);border-radius:99px;padding:3px 9px;letter-spacing:.10em;text-transform:uppercase}

/* Detail */
.wow-mock--detail{background:linear-gradient(165deg,#0A0A0A 0%,#1A1A1A 50%,#050505 100%);color:#C0C0C0;position:relative;overflow:hidden}
.wow-mock--detail::after{
  content:"";position:absolute;top:30%;left:-10%;width:120%;height:40%;
  background:linear-gradient(115deg,transparent 30%,rgba(192,192,192,.30) 50%,transparent 70%);
  transform:rotate(-8deg);
}
.wow-mock--detail .wow-mock-logo{color:#FAFAF7;letter-spacing:.18em;text-transform:uppercase;font-weight:300;font-size:8.5px;position:relative;z-index:2}
.wow-mock--detail .wow-mock-menu{color:rgba(192,192,192,.55);position:relative;z-index:2}
.wow-mock--detail .wow-mock-body{position:relative;z-index:2}
.wow-mock--detail .wow-mock-h{color:#FAFAF7;font-weight:300;letter-spacing:-.02em}
.wow-mock--detail .wow-mock-cta{background:#FAFAF7;color:#0A0A0A;text-transform:uppercase;letter-spacing:.06em;font-weight:700}

/* ============================================================
   Hide the legacy .wow-car-stage if it lingers
   ============================================================ */
.wow-card .wow-car-stage{display:none}
