/* projectexperiences.html - page-specific styles */

/* ---------- Why AVEX / Values (Option 5 — Connected Timeline) ---------- */
.avx-car-values{position:relative;padding:clamp(4rem,8vw,6rem) 0 clamp(4.5rem,7vw,5.5rem);background:#f4f7fa}
.avx-car-values .kicker{display:inline-flex;align-items:center;gap:.65rem;font-family:"DM Sans",sans-serif;font-size:13px;font-weight:800;letter-spacing:.26em;text-transform:uppercase;color:#0e7a6d !important;margin:0 0 1rem}
/*.avx-car-values .kicker::before{content:"";width:28px;height:2px;background:linear-gradient(90deg,#0d9e9e,#3dbb8e);font-size:13px;}*/
.avx-car-values-h2{font-family:"DM Sans",sans-serif;font-weight:800;font-size:clamp(1.9rem,3.4vw,2.6rem);line-height:1.16;margin:.2rem 0 1rem;color:#0a0c2e !important}
.avx-car-values-lede{color:#55607a !important;line-height:1.8;font-size:1rem;max-width:64ch;margin:0 0 2.8rem}

.avx-car-values-flow{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.avx-car-values-flow::before{content:"";position:absolute;top:26px;left:12.5%;right:12.5%;height:2px;
  background:linear-gradient(90deg,#0d9e9e,#3dbb8e,#8fd16a);z-index:0}
.avx-car-values-node{position:relative;text-align:center;padding:0 1rem}
.avx-car-values-dot{width:52px;height:52px;border-radius:50%;background:#fff;border:2px solid rgba(13,158,158,.35);
  display:grid;place-items:center;margin:0 auto 1.3rem;position:relative;z-index:1;
  transition:transform .4s cubic-bezier(.34,1.4,.5,1),border-color .4s,background .4s}
.avx-car-values-node:hover .avx-car-values-dot{transform:scale(1.08);background:linear-gradient(150deg,#0d9e9e,#3dbb8e);border-color:transparent}
.avx-car-values-dot svg{width:22px;height:22px;stroke:#0e7a6d;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s}
.avx-car-values-node:hover .avx-car-values-dot svg{stroke:#fff}
.avx-car-values-node h3{font-family:"DM Sans",sans-serif;font-weight:800;font-size:.98rem;margin:0 0 .6rem;color:#0a0c2e !important}
.avx-car-values-node p{margin:0;font-size:.85rem;color:#55607a !important;line-height:1.6}

@media(max-width:900px){
  .avx-car-values-flow{grid-template-columns:1fr 1fr;row-gap:2.2rem}
  .avx-car-values-flow::before{display:none}
}
@media(max-width:560px){
  .avx-car-values-flow{grid-template-columns:1fr}
}

/* ---------- Open Positions ---------- */
.avx-car-openings{position:relative;padding:clamp(4rem,8vw,6rem) 0;background:#fff}
.avx-car-openings-head{max-width:64ch;margin:0 0 2rem}
.avx-car-openings-head h2{font-family:"DM Sans",sans-serif;font-weight:800;font-size:clamp(1.9rem,3.4vw,2.6rem);line-height:1.16;margin:.2rem 0 1rem;color:#0a0c2e !important}
.avx-car-openings-lede{color:#55607a !important;line-height:1.8;font-size:1rem;margin:0}

/* toolbar: search + filters */
.avx-car-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin:2.2rem 0 1rem}

.avx-car-search{position:relative;flex:0 1 320px;min-width:220px}
.avx-car-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:17px;height:17px;stroke:#8892a6;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.avx-car-search input{width:100%;font-family:Inter,Arial,sans-serif;font-size:.9rem;color:#0a0c2e !important;
  background:#f4f7fa;border:1.5px solid rgba(10,12,46,.09);border-radius:999px;
  padding:.75rem 1rem .75rem 2.6rem;transition:border-color .25s,box-shadow .25s}
.avx-car-search input::placeholder{color:#8892a6}
.avx-car-search input:focus{outline:none;border-color:#0d9e9e;box-shadow:0 0 0 3px rgba(13,158,158,.14)}

.avx-car-filters{display:flex;flex-wrap:wrap;gap:.6rem}
.avx-car-filter{display:inline-flex;align-items:center;gap:.45rem;font-family:"DM Sans",sans-serif;font-weight:700;font-size:.83rem;color:#0a0c2e !important;
  background:#e9f3ef;border:1.5px solid transparent;border-radius:999px;padding:.6rem 1.2rem;
  cursor:pointer;transition:background .25s,border-color .25s,color .25s,transform .25s}
.avx-car-filter:hover{border-color:rgba(13,158,158,.35);transform:translateY(-1px)}
.avx-car-filter.is-active{background:linear-gradient(100deg,#0d9e9e,#3dbb8e);color:#04121a !important;border-color:transparent;
  box-shadow:0 10px 22px rgba(13,158,158,.28)}
.avx-car-count{display:inline-flex;align-items:center;justify-content:center;min-width:19px;height:19px;
  background:rgba(10,12,46,.08);color:#55607a !important;font-size:.7rem;font-weight:800;border-radius:999px;padding:0 .35rem}
.avx-car-filter.is-active .avx-car-count{background:rgba(4,18,26,.18);color:#04121a !important}

.avx-car-results-summary{font-family:"DM Sans",sans-serif;font-size:.85rem;color:#8892a6 !important;margin:0 0 1.4rem}
.avx-car-results-summary b{color:#0a0c2e !important}

.avx-car-list{display:flex;flex-direction:column;gap:1rem}
.avx-car-role{position:relative;display:flex;align-items:center;gap:1.4rem;background:#fff;
  border:1.5px solid rgba(10,12,46,.09);border-left:4px solid var(--racc,#0d9e9e);
  border-radius:16px;padding:1.4rem 1.8rem;text-decoration:none;color:inherit;
  transition:transform .35s cubic-bezier(.34,1.4,.5,1),box-shadow .35s,border-color .35s}
.avx-car-role:hover{transform:translateY(-3px) translateX(2px);box-shadow:0 20px 40px rgba(10,12,46,.11);border-color:rgba(13,158,158,.4)}

.avx-car-role-ic{flex:0 0 auto;width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:var(--racc-soft,rgba(13,158,158,.12))}
.avx-car-role-ic svg{width:21px;height:21px;stroke:var(--racc,#0d9e9e);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.avx-car-ic-engineering{--racc:#0e4d6e;--racc-soft:rgba(14,77,110,.12)}
.avx-car-ic-quality{--racc:#0d9e9e;--racc-soft:rgba(13,158,158,.12)}
.avx-car-ic-ops{--racc:#3dbb8e;--racc-soft:rgba(61,187,142,.12)}
.avx-car-role[data-dept="engineering"]{--racc:#0e4d6e}
.avx-car-role[data-dept="quality"]{--racc:#0d9e9e}
.avx-car-role[data-dept="ops"]{--racc:#3dbb8e}

.avx-car-role-main{flex:1 1 auto;min-width:0}
.avx-car-role-title-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.avx-car-role-main h3{font-family:"DM Sans",sans-serif;font-weight:800;font-size:1.08rem;margin:0 0 .5rem;color:#0a0c2e !important}
.avx-car-role-main p{margin:0 0 .8rem;font-size:.88rem;line-height:1.6;color:#55607a !important;max-width:56ch}

.avx-car-badge{font-family:"DM Sans",sans-serif;font-weight:800;font-size:.68rem;letter-spacing:.03em;
  text-transform:uppercase;padding:.25rem .55rem;border-radius:999px;margin-bottom:.5rem}
.avx-car-badge--new{background:rgba(143,209,106,.18);color:#4a8f2c !important}
.avx-car-badge--remote{background:rgba(13,158,158,.14);color:#0e7a6d !important}

.avx-car-role-tags{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.avx-car-tag{background:#e9f3ef;color:#0e7a6d !important;font-weight:700;padding:.35rem .8rem;border-radius:999px;font-size:.74rem}
.avx-car-loc{display:inline-flex;align-items:center;gap:.3rem;font-size:.8rem;color:#55607a !important;font-family:"DM Sans",sans-serif;font-weight:600}
.avx-car-loc svg{width:13px;height:13px;stroke:#8892a6;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.avx-car-type{font-size:.78rem;color:#8892a6 !important;font-weight:600}

.avx-car-apply-btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:.4rem;
  font-family:"DM Sans",sans-serif;font-weight:800;font-size:.82rem;color:#04121a !important;
  background:linear-gradient(100deg,#0d9e9e,#3dbb8e);padding:.65rem 1.15rem;border-radius:999px;
  white-space:nowrap;transition:transform .3s cubic-bezier(.34,1.4,.5,1),box-shadow .3s}
.avx-car-apply-btn svg{width:14px;height:14px;stroke:#04121a;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s cubic-bezier(.34,1.4,.5,1)}
.avx-car-role:hover .avx-car-apply-btn{box-shadow:0 10px 22px rgba(13,158,158,.35)}
.avx-car-role:hover .avx-car-apply-btn svg{transform:translate(2px,-2px)}

.avx-car-empty{display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:3.5rem 1.5rem;background:#f4f7fa;border-radius:16px}
.avx-car-empty svg{width:34px;height:34px;stroke:#8892a6;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;margin-bottom:1rem}
.avx-car-empty h3{font-family:"DM Sans",sans-serif;font-weight:800;font-size:1.05rem;margin:0 0 .5rem;color:#0a0c2e !important}
.avx-car-empty p{margin:0;font-size:.88rem;color:#55607a !important}
.avx-car-empty p a{color:#0e7a6d !important;font-weight:700}

@media(max-width:760px){
  .avx-car-toolbar{flex-direction:column;align-items:stretch}
  .avx-car-search{flex:1 1 auto}
  .avx-car-role{flex-wrap:wrap;align-items:flex-start}
  .avx-car-apply-btn{margin-left:60px}
}

/* ---------- Life at AVEX / Culture strip (bento grid, no dead space) ---------- */
.avx-car-culture{position:relative;padding:clamp(4rem,8vw,6rem) 0;background:#e9f3ef}
.avx-car-culture-head{max-width:64ch;margin:0 0 2.5rem}
.avx-car-culture-head h2{font-family:"DM Sans",sans-serif;font-weight:800;font-size:clamp(1.7rem,3vw,2.2rem);line-height:1.2;margin:.2rem 0 0;color:#0a0c2e !important}

.avx-car-culture-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:180px;gap:1rem}
.avx-car-cphoto{position:relative;border-radius:18px;background-size:cover;background-position:center;
  overflow:hidden;box-shadow:0 10px 24px rgba(10,12,46,.1);
  transition:transform .5s cubic-bezier(.34,1.4,.5,1),box-shadow .5s}
.avx-car-cphoto::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,12,46,0) 45%,rgba(10,12,46,.75) 100%);
  opacity:0;transition:opacity .4s}
.avx-car-cphoto span{position:absolute;left:1.1rem;bottom:1rem;right:1.1rem;z-index:1;
  font-family:"DM Sans",sans-serif;font-weight:700;font-size:.86rem;color:#fff;
  opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s}
.avx-car-cphoto:hover{transform:translateY(-5px);box-shadow:0 22px 44px rgba(10,12,46,.2)}
.avx-car-cphoto:hover::after{opacity:1}
.avx-car-cphoto:hover span{opacity:1;transform:translateY(0)}

/* big tile spans 2 columns x 2 rows; the 4 small tiles fill the remaining 2x2 block exactly */
.avx-car-cphoto--big{grid-column:span 2;grid-row:span 2}

@media(max-width:900px){
  .avx-car-culture-grid{grid-template-columns:1fr 1fr;grid-auto-rows:170px}
  .avx-car-cphoto--big{grid-column:span 2;grid-row:span 1}
}
@media(max-width:560px){
  .avx-car-culture-grid{grid-template-columns:1fr}
  .avx-car-cphoto--big{grid-column:span 1}
  .avx-car-cphoto span{opacity:1;transform:none}
  .avx-car-cphoto::after{opacity:1}
}

/* ---------- Benefits ---------- */
.avx-car-benefits{position:relative;padding:clamp(4rem,8vw,6rem) 0;background:#fff}
.avx-car-benefits-head{max-width:64ch;margin:0 0 2.5rem}
.avx-car-benefits-head h2{font-family:"DM Sans",sans-serif;font-weight:800;font-size:clamp(1.7rem,3vw,2.2rem);line-height:1.2;margin:.2rem 0 0;color:#0a0c2e !important}

.avx-car-benefits-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.avx-car-benefit{position:relative;background:#e9f3ef;border-radius:16px;padding:1.7rem 1.7rem;
  transition:transform .4s cubic-bezier(.34,1.4,.5,1),background .4s}
.avx-car-benefit:hover{transform:translateY(-4px);background:#dff1ea}
.avx-car-bic{display:flex;width:38px;height:38px;border-radius:11px;align-items:center;justify-content:center;
  margin-bottom:1rem;background:linear-gradient(150deg,#0d9e9e,#3dbb8e)}
.avx-car-bic svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.avx-car-benefit b{display:block;font-family:"DM Sans",sans-serif;font-weight:800;font-size:1rem;color:#0a0c2e !important;margin-bottom:.5rem}
.avx-car-benefit span:not(.avx-car-bic){font-size:.88rem;line-height:1.6;color:#55607a !important}

@media(max-width:860px){.avx-car-benefits-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.avx-car-benefits-grid{grid-template-columns:1fr}}