.powerbrix-portfolio {
  --pb-ink: #17191f;
  width: min(1200px, 100%);
  margin: 0 auto 20px;
  color: var(--pb-ink);
  font-family: 'Inter', sans-serif;
}

.powerbrix-studio-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 0;
  border: 1px solid #e6e7e8;
  border-radius: 23px;
  background: #fafaf8;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.powerbrix-studio-card:hover {
  transform: translateY(-3px);
  border-color: rgba(95,73,255,.28);
  box-shadow: 0 25px 50px -42px rgba(22,24,31,.5);
}
.powerbrix-studio-visual {
  position: relative;
  overflow: hidden;
  display: grid;
  place-content: center;
  aspect-ratio: 780 / 524;
  margin: 12px 12px 0;
  border: 1px solid #e7e5f2;
  border-radius: 15px;
  background:
    radial-gradient(circle at 75% 20%, rgba(95,73,255,.2), transparent 34%),
    radial-gradient(circle at 22% 85%, rgba(42,201,219,.17), transparent 34%),
    linear-gradient(rgba(18,20,27,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18,20,27,.025) 1px, transparent 1px),
    #f4f4f6;
  background-size: auto, auto, 32px 32px, 32px 32px, auto;
}
.powerbrix-studio-visual img { width: 58px; height: 52px; margin: 0 auto 12px; object-fit: contain; }
.powerbrix-studio-visual span { color: #202228; font: 700 25px/1 'Inter', sans-serif; letter-spacing: -.05em; }
.powerbrix-studio-copy { display: flex; flex: 1; flex-direction: column; padding: 28px 33px 30px; }
.powerbrix-lockup { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.powerbrix-lockup img { width: 40px; height: 40px; padding: 4px; object-fit: contain; border-radius: 11px; background: rgba(95,73,255,.08); }
.powerbrix-lockup div { display: grid; gap: 6px; }
.powerbrix-lockup h3 { margin: 0; color: #22242a; font: 650 21px/1.05 'Inter', sans-serif; letter-spacing: -.04em; }
.powerbrix-lockup span { color: #8e919a; font: 500 11px/1 'Inter', sans-serif; text-transform: uppercase; letter-spacing: .08em; }
.powerbrix-studio-lede { max-width: 500px; margin: 0 0 18px; color: #686d76; font: 400 15px/1.7 'Inter', sans-serif; }
.powerbrix-studio-copy .powerbrix-main-link { align-self: flex-start; margin-top: auto; min-height: 39px; padding: 0 18px; font-size: 12px; }
.powerbrix-main-link,
.powerbrix-product-body > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 21px;
  border: 1px solid #1c1e24;
  border-radius: 100px;
  background: #1c1e24;
  color: #fff;
  text-decoration: none;
  font: 600 13px/1 'Inter', sans-serif;
  transition: background .25s ease, color .25s ease, transform .25s ease;
}
.powerbrix-main-link:hover,
.powerbrix-product-body > a:hover { background: #fff; color: #1c1e24; transform: translateY(-1px); }

.powerbrix-products-heading { display: grid; grid-template-columns: minmax(0,.65fr) minmax(0,1fr); gap: 9px 48px; align-items: end; padding: 94px 8px 39px; }
.powerbrix-products-heading p { grid-row: 1 / 3; align-self: start; margin: 8px 0 0; color: #858892; font: 500 12px/1 'Inter', sans-serif; text-transform: uppercase; letter-spacing: .1em; }
.powerbrix-products-heading h3 { margin: 0; color: #1c1e24; font: 500 clamp(34px, 4vw, 54px)/1.05 'Inter', sans-serif; letter-spacing: -.06em; }
.powerbrix-products-heading > span { max-width: 650px; color: #71757f; font: 400 16px/1.65 'Inter', sans-serif; }

.powerbrix-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
.powerbrix-product { position: relative; overflow: hidden; display: flex; flex-direction: column; min-height: 0; border: 1px solid #e6e7e8; border-radius: 23px; background: #fafaf8; transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.powerbrix-product:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--product) 28%, #e6e7e8); box-shadow: 0 25px 50px -42px rgba(22,24,31,.5); }
.powerbrix-product-demo { position: relative; overflow: hidden; aspect-ratio: 780 / 524; margin: 12px 12px 0; border: 1px solid #ececef; border-radius: 15px; background: #f1f1f3; }
.powerbrix-product-demo video { display: block; width: 100%; height: 100%; object-fit: contain; background: #f1f1f3; transform: scale(1.001); transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.powerbrix-product:hover .powerbrix-product-demo video { transform: scale(1.018); }
.powerbrix-product-body { display: flex; flex: 1; flex-direction: column; padding: 28px 33px 30px; }
.powerbrix-product-name { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.powerbrix-product-name img { width: 40px; height: 40px; padding: 4px; object-fit: contain; border-radius: 11px; background: color-mix(in srgb, var(--product) 8%, #f2f2ef); }
.powerbrix-product-name div { display: grid; gap: 6px; }
.powerbrix-product-name h4 { margin: 0; color: #22242a; font: 650 21px/1.05 'Inter', sans-serif; letter-spacing: -.04em; }
.powerbrix-product-name span { color: #8e919a; font: 500 11px/1 'Inter', sans-serif; text-transform: uppercase; letter-spacing: .08em; }
.powerbrix-product-body > p { max-width: 500px; margin: 0 0 18px; color: #686d76; font: 400 15px/1.7 'Inter', sans-serif; }
.powerbrix-product-body > a { align-self: flex-start; margin-top: auto; min-height: 39px; padding: 0 18px; font-size: 12px; }

/* Keep every non-PowerBrix venture in the same continuous portfolio grid. */
.portfolio-card,
.portfolio-card.card-dark,
.portfolio-card.card-light {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 0;
  border: 1px solid #e6e7e8;
  border-radius: 23px;
  background: #fafaf8;
  color: #22242a;
}
.portfolio-card::before { display: none; }
.portfolio-card-visual {
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  aspect-ratio: 780 / 524;
  margin: 12px 12px 0;
  border: 1px solid color-mix(in srgb, var(--venture) 12%, #e6e7e8);
  border-radius: 15px;
  background:
    radial-gradient(circle at 76% 18%, color-mix(in srgb, var(--venture) 18%, transparent), transparent 35%),
    radial-gradient(circle at 20% 86%, color-mix(in srgb, var(--venture) 10%, transparent), transparent 34%),
    linear-gradient(rgba(18,20,27,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18,20,27,.025) 1px, transparent 1px),
    #f4f4f6;
  background-size: auto, auto, 32px 32px, 32px 32px, auto;
}
.portfolio-card-visual img {
  width: auto;
  height: auto;
  max-width: 54%;
  max-height: 82px;
  object-fit: contain;
}
.portfolio-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 28px 33px 30px;
}
.portfolio-card .card-header { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; }
.portfolio-card .card-header > div { display: grid; gap: 6px; min-width: 0; }
.portfolio-card .card-logo,
.portfolio-card .card-logo.circle-logo {
  width: 40px;
  height: 40px;
  max-width: 40px;
  padding: 4px;
  border-radius: 11px;
  background: color-mix(in srgb, var(--venture) 8%, #f2f2ef);
  object-fit: contain;
}
.portfolio-card .card-name {
  margin: 0;
  color: #22242a;
  font: 650 21px/1.05 'Inter', sans-serif;
  letter-spacing: -.04em;
}
.portfolio-card .card-badge,
.portfolio-card.card-dark .card-badge,
.portfolio-card.card-light .card-badge {
  display: block;
  width: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #8e919a;
  font: 500 11px/1 'Inter', sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.portfolio-card .card-title,
.portfolio-card.card-dark .card-title {
  margin: 0 0 12px;
  color: #2c2f36;
  font: 600 18px/1.35 'Inter', sans-serif;
  letter-spacing: -.025em;
}
.portfolio-card .card-desc,
.portfolio-card.card-dark .card-desc,
.portfolio-card.card-light .card-desc {
  margin: 0;
  color: #686d76;
  font: 400 15px/1.7 'Inter', sans-serif;
}
.portfolio-card .boosend-signup-btn {
  align-self: flex-start;
  min-height: 39px;
  margin-top: 20px;
  padding: 0 18px;
  border-radius: 100px;
  font-size: 12px;
}
.portfolio-card .card-ribbon {
  position: absolute;
  top: 25px;
  right: 25px;
  z-index: 4;
  width: auto;
  height: auto;
  overflow: visible;
}
.portfolio-card .card-ribbon::after {
  position: static;
  display: block;
  width: auto;
  padding: 7px 10px;
  border-radius: 999px;
  background: #1f9d59;
  color: #fff;
  font: 700 10px/1 'Inter', sans-serif;
  letter-spacing: .09em;
  transform: none;
}

@media (max-width: 800px) {
  .powerbrix-products-heading { grid-template-columns: 1fr; }
  .powerbrix-products-heading p { grid-row: auto; margin-bottom: 11px; }
}
@media (max-width: 680px) {
  .portfolio-section { padding-inline: 14px; }
  .powerbrix-portfolio { margin-bottom: 80px; }
  .powerbrix-studio-card { width: 100%; }
  .powerbrix-studio-visual { margin: 9px 9px 0; border-radius: 13px; }
  .powerbrix-studio-copy { padding: 28px 25px 26px; }
  .powerbrix-lockup img { width: 38px; height: 38px; }
  .powerbrix-studio-lede { font-size: 14px; }
  .powerbrix-products-heading { padding: 70px 5px 30px; }
  .powerbrix-products-heading h3 { font-size: 38px; }
  .powerbrix-products-heading > span { font-size: 15px; }
  .powerbrix-product-grid { grid-template-columns: 1fr; gap: 14px; }
  .powerbrix-product { min-height: 0; }
  .powerbrix-product-demo { margin: 9px 9px 0; border-radius: 13px; }
  .powerbrix-product-body { padding: 28px 25px 26px; }
  .powerbrix-product-name img { width: 38px; height: 38px; }
  .powerbrix-product-body > p { font-size: 14px; }
  .portfolio-card { min-height: 0; }
  .portfolio-card-visual { margin: 9px 9px 0; border-radius: 13px; }
  .portfolio-card-body { padding: 28px 25px 26px; }
  .portfolio-card .card-logo,
  .portfolio-card .card-logo.circle-logo { width: 38px; height: 38px; }
  .portfolio-card .card-desc { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .powerbrix-studio-card, .powerbrix-product, .powerbrix-product-demo video, .powerbrix-main-link, .powerbrix-product-body > a { transition: none; }
}
