/* GG Project Center - Theme matched
   We intentionally do NOT create our own card look.
   The theme provides .section, .container, .contact-grid, .card, .card-header-inline, etc.
   This CSS only styles the Project Center internals (tiles, chips, search) to match the site's vibe.
*/

.ggpc-center{
  --ggpc-accent: #d4af37;
}

.ggpc-theme-grid{
  /* Uses theme's grid. We only add spacing tweaks if needed. */
}

.ggpc-side{
  position: sticky;
  top: 90px;
}
@media (max-width: 1024px){
  .ggpc-side{ position: static; top: auto; }
}

/* Count pill in header (subtle, same vibe as other UI) */
.ggpc-count-pill{
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  padding: 0 0.6rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.85);
  font-weight: 700;
  font-size: .85rem;
}

/* Filters */
.ggpc-search{
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .75rem .85rem;
  border-radius: .75rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
}

.ggpc-search i{
  opacity: .85;
}

.ggpc-search input{
  width: 100%;
  border: 0;
  outline: none;
  background: transparent;
  color: rgba(255,255,255,0.92);
  font-size: 1rem;
}

.ggpc-search input::placeholder{
  color: rgba(255,255,255,0.55);
}

.ggpc-clear{
  width: 34px;
  height: 34px;
  border-radius: .6rem;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.15);
  color: rgba(255,255,255,0.75);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease;
}
.ggpc-clear.is-on{ opacity: 1; pointer-events: auto; }
.ggpc-clear:hover{ border-color: rgba(255,255,255,0.18); }

.ggpc-filter-group{ margin-top: 1rem; }
.ggpc-filter-label{
  font-size: .78rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  opacity: .8;
  font-weight: 700;
  margin-bottom: .55rem;
}



.ggpc-chip-row--scroll{
  flex-wrap: nowrap;
  overflow: visible;
  -webkit-overflow-scrolling: touch;
  padding-bottom: .25rem;
}
.ggpc-chip-row--scroll::-webkit-scrollbar{ height: 6px; }
.ggpc-chip-row--scroll::-webkit-scrollbar-thumb{ background: rgba(255,255,255,0.10); border-radius: 999px; }

.ggpc-chip{
  appearance: none;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.86);
  border-radius: 999px;
  padding: .45rem .8rem;
  font-weight: 700;
  font-size: .88rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  white-space: nowrap;
  transition: transform .08s ease, border-color .12s ease, background-color .12s ease;
}

.ggpc-chip:hover{
  border-color: rgba(255,255,255,0.18);
  transform: translateY(-1px);
}

.ggpc-chip.is-active{
  background: rgba(212,175,55,0.18);
  border-color: rgba(212,175,55,0.35);
  color: rgba(255,255,255,0.95);
}

.ggpc-mini{
  margin-top: 1.15rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(255,255,255,0.08);
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.ggpc-mini-pill{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .33rem .6rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.75);
  font-weight: 600;
  font-size: .86rem;
}
.ggpc-mini-pill strong{ color: rgba(255,255,255,0.95); font-weight: 700; }

.ggpc-mini-pill .dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--ggpc-accent);
  box-shadow: 0 0 0 3px rgba(0,0,0,0.25);
}

/* Tiles grid inside a theme card */
.ggpc-tiles{
  display: grid;
  gap: .8rem;
}
.ggpc-tiles--2{ grid-template-columns: repeat(2, minmax(0,1fr)); }
.ggpc-tiles--3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
.ggpc-tiles--4{ grid-template-columns: repeat(4, minmax(0,1fr)); }

@media (max-width: 1100px){
  .ggpc-tiles--4{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 900px){
  .ggpc-tiles--3, .ggpc-tiles--4{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px){
  .ggpc-tiles--2, .ggpc-tiles--3, .ggpc-tiles--4{ grid-template-columns: 1fr; }
}

.ggpc-tile{
  border-radius: .75rem;
  padding: .75rem .85rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  transition: transform .12s ease, border-color .12s ease, background-color .12s ease;
}

.ggpc-tile:hover{
  transform: translateY(-2px);
  border-color: rgba(212,175,55,0.28);
  background: rgba(255,255,255,0.035);
}

.ggpc-tile-top{
  display: flex;
  gap: .75rem;
  align-items: center;
}

.ggpc-tile-icon{
  width: 40px;
  height: 40px;
  border-radius: .7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.18);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--ggpc-accent);
  flex: 0 0 auto;
}

.ggpc-tile-title{
  margin: 0;
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.15;
}

.ggpc-tile-tagline{
  margin-top: .15rem;
  font-size: .88rem;
  opacity: .8;
  font-weight: 600;
}

.ggpc-tile-summary{
  margin: .65rem 0 0;
  font-size: .90rem;
  line-height: 1.55;
  opacity: .9;
}

.ggpc-tile-facts{
  margin-top: .65rem;
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.ggpc-fact{
  font-size: .80rem;
  padding: .22rem .5rem;
  border-radius: 999px;
  background: rgba(0,0,0,0.14);
  border: 1px solid rgba(255,255,255,0.08);
  opacity: .9;
}

.ggpc-tile-foot{
  margin-top: .75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  flex-wrap: wrap;
}

.ggpc-badge{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  font-size: .82rem;
  padding: .25rem .55rem;
  border-radius: 999px;
  background: rgba(0,0,0,0.14);
  border: 1px solid rgba(255,255,255,0.08);
  font-weight: 700;
}

.ggpc-dot{
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--b, var(--ggpc-accent));
  box-shadow: 0 0 0 3px rgba(0,0,0,0.25);
}

.ggpc-status{
  font-size: .82rem;
  opacity: .85;
  font-weight: 600;
}

.ggpc-link{
  text-decoration: none;
  font-weight: 700;
  color: var(--ggpc-accent);
  white-space: nowrap;
}
.ggpc-link:hover{ text-decoration: underline; }

.ggpc-tags{
  margin-top: .6rem;
  display: flex;
  gap: .4rem;
  flex-wrap: wrap;
}

.ggpc-tag{
  font-size: .76rem;
  padding: .20rem .48rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.02);
  opacity: .85;
  font-weight: 600;
}

.ggpc-empty{
  border-radius: .75rem;
  padding: .85rem;
  background: rgba(255,255,255,0.02);
  border: 1px dashed rgba(255,255,255,0.14);
  opacity: .85;
}

.ggpc-more{
  margin-top: 1rem;
  display: flex;
  justify-content: center;
}

.ggpc-more-btn{
  border-radius: 999px;
  padding: .55rem 1rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.90);
  cursor: pointer;
  font-weight: 700;
}
.ggpc-more-btn:hover{ border-color: rgba(255,255,255,0.18); }

.ggpc-more-count{ opacity: .75; margin-left: .35rem; }

.is-hidden{ display: none !important; }
.card.ggpc-card.is-empty{ display: none; }


/* --- GGPC adjustments: filters-left + one results card --- */
.ggpc-theme-grid--filters-left{
  grid-template-columns: 340px 1fr;
  gap: 1.25rem;
}
@media (max-width: 980px){
  .ggpc-theme-grid--filters-left{
  grid-template-columns: 340px 1fr;
  gap: 1.25rem;
}
}

.ggpc-side{
  position: sticky;
  top: 84px;
}
@media (max-width: 980px){
  .ggpc-side{ position: static; }
}

/* Chip rows: WRAP (no scrollbars) */
.ggpc-chip-row{
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  overflow: visible;
}
.ggpc-chip{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .48rem .78rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.22);
  color: rgba(255,255,255,0.90);
  font-weight: 800;
  font-size: .86rem;
  cursor: pointer;
  white-space: nowrap;
}
.ggpc-chip.is-active{
  background: var(--ggpc-accent);
  border-color: transparent;
  color: #111;
}

/* Search */
.ggpc-search{
  display:flex;
  align-items:center;
  gap:.6rem;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.22);
  border-radius: 14px;
  padding: .75rem .85rem;
  margin-bottom: 1.05rem;
}
.ggpc-search input{
  border:0;
  background: transparent;
  outline:none;
  width: 100%;
  color: rgba(255,255,255,0.92);
  font-size: 1rem;
}
.ggpc-search input::placeholder{ color: rgba(255,255,255,0.45); }
.ggpc-clear{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.18);
  color: rgba(255,255,255,0.65);
  cursor:pointer;
  opacity: 0;
  pointer-events: none;
}
.ggpc-clear.is-on{ opacity: 1; pointer-events:auto; }

.ggpc-filter-block{ margin-top: 1.0rem; }
.ggpc-filter-label{
  margin-bottom: .55rem;
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 900;
  color: rgba(255,255,255,0.55);
}

/* Stage blocks inside one results card */
.ggpc-stage-block{
  padding: 1.05rem 0;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.ggpc-stage-block:first-child{
  padding-top: 0;
  border-top: 0;
}
.ggpc-stage-head{
  display:flex;
  align-items:flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .85rem;
}
.ggpc-stage-left{
  display:flex;
  align-items:flex-start;
  gap: .75rem;
  min-width: 0;
}
.ggpc-stage-icon{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.22);
  color: var(--ggpc-accent);
  flex: 0 0 auto;
}
.ggpc-stage-title{
  font-weight: 900;
  font-size: 1.05rem;
  line-height: 1.1;
  color: rgba(255,255,255,0.92);
}
.ggpc-stage-tagline{
  margin-top: .25rem;
  color: rgba(255,255,255,0.58);
  line-height: 1.5;
  font-size: .92rem;
}
.ggpc-stage-count{
  min-width: 34px;
  height: 34px;
  padding: 0 .55rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.20);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 900;
  color: rgba(255,255,255,0.90);
}

/* Hide empty stage blocks after filtering */
.ggpc-stage-block.is-empty{ display:none; }


/* Force layout proportions even if theme sets .contact-grid to 50/50 */
.ggpc-center .contact-grid.ggpc-theme-grid.ggpc-theme-grid--filters-left{
  display: grid !important;
  grid-template-columns: 320px minmax(0, 1fr) !important;
  gap: 1.25rem !important;
  align-items: start !important;
}

@media (max-width: 980px){
  .ggpc-center .contact-grid.ggpc-theme-grid.ggpc-theme-grid--filters-left{
    grid-template-columns: 1fr !important;
  }
}

/* Ensure the side column doesn't stretch wider due to card/content */
.ggpc-center .ggpc-side{ width: 100%; }
.ggpc-center .ggpc-main{ width: 100%; }



/* Stage cards: each stage is its own card (no nested blocks) */
.ggpc-center .ggpc-stage-cards{
  display: grid;
  gap: 1.25rem;
}

.ggpc-center .ggpc-stage-card .card-header-inline{
  align-items: flex-start;
}

.ggpc-center .ggpc-stage-headtext{
  flex: 1;
  min-width: 0;
}

.ggpc-center .ggpc-stage-count{
  margin-left: auto;
  min-width: 34px;
  height: 34px;
  padding: 0 .55rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.20);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 900;
  color: rgba(255,255,255,0.90);
}

/* Previous block divider styles are no longer needed, but harmless if present.
   Ensure empty stage cards hide cleanly after filtering. */
.ggpc-center .ggpc-stage-block.is-empty{ display:none; }


/* --- GGPC polish: spacing + alignment + empty states --- */
.ggpc-center .contact-grid.ggpc-theme-grid.ggpc-theme-grid--filters-left{
  align-items: start !important;
}

.ggpc-center .ggpc-stage-cards{
  display: grid;
  gap: 1.25rem;
  padding: 0;
}

.ggpc-center .ggpc-empty{
  border: 1px dashed rgba(255,255,255,0.14);
  background: rgba(0,0,0,0.16);
  border-radius: 14px;
  padding: 0.95rem 1.0rem;
  color: rgba(255,255,255,0.70);
}

.ggpc-center .ggpc-empty-results .ggpc-empty--global{
  margin-top: 0;
}

.ggpc-center .is-hidden{
  display: none !important;
}

/* Make sure stage cards have consistent internal spacing even if theme varies by template */
.ggpc-center .ggpc-stage-card .card-body{
  padding-top: 1.05rem;
}

/* Ensure the left and right columns visually line up */
.ggpc-center .ggpc-side,
.ggpc-center .ggpc-main{
  align-self: start;
}





/* Some templates override .card padding; set GGPC to the same compact spacing used across the site */
.ggpc-center .ggpc-card.card .card-header-inline{
  padding: 1.05rem 1.15rem 0.80rem !important;
}
.ggpc-center .ggpc-card.card .card-body{
  padding: 0.95rem 1.15rem 1.10rem !important;
}
/* Keep stage tiles aligned; no extra top-padding beyond normal */
.ggpc-center .ggpc-stage-card .card-body{
  padding-top: 0.95rem !important;
}


/* --- GGPC: match theme card padding exactly (theme uses .card { padding: 1.1rem 1.2rem; }) --- */
.ggpc-center .ggpc-card.card{
  padding: 1.1rem 1.2rem !important;
}

/* Do NOT add extra padding inside header/body; let the card padding do the work */
.ggpc-center .ggpc-card.card .card-header-inline{
  padding: 0 !important;
}
.ggpc-center .ggpc-card.card .card-body{
  padding: 0 !important;
}

/* Provide the same vertical rhythm your cards use: header then body */
.ggpc-center .ggpc-card.card .card-body{
  margin-top: 0.95rem;
}


/* --- GGPC: footer overlap guard (sticky filter should not cover the footer) --- */
.ggpc-center{
  padding-bottom: 2.25rem;
}
.ggpc-center .ggpc-side.is-footer-visible{
  position: static !important;
  top: auto !important;
}
