/* BOLIX Architektams ir dizaineriams — purpose/content layer v2
 * Keeps the existing soft B2B visual language, but makes content calmer and more meaningful.
 */
.bolix-arch__section{
  padding:48px 0!important;
}
.bolix-arch__head{
  margin-bottom:26px!important;
  gap:36px!important;
}
.bolix-arch__head>p{
  max-width:600px!important;
}

/* Hero copy: slightly calmer and more editorial. */
.bolix-arch__hero-grid{
  gap:46px!important;
}
.bolix-arch__hero-copy h1{
  max-width:790px!important;
}
.bolix-arch__hero-meta{
  gap:8px 16px!important;
}

/* Meaning cards: tags instead of decorative square letters. */
.bolix-arch__cards{
  gap:14px!important;
}
.bolix-arch__card{
  min-height:245px!important;
  padding:24px!important;
}
.bolix-arch__card-mark{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  height:30px!important;
  min-width:0!important;
  margin-bottom:18px!important;
  padding:0 11px!important;
  border:0!important;
  border-radius:999px!important;
  background:#fff1f2!important;
  color:#e30613!important;
  font-size:10px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  line-height:1!important;
}
.bolix-arch__card h3{
  min-height:0!important;
  margin-bottom:9px!important;
  font-size:19px!important;
}
.bolix-arch__card p{
  font-size:13.5px!important;
  line-height:1.5!important;
}
.bolix-arch__card .bolix-arch__text-link{
  padding-top:14px!important;
}

/* Technical-support split: compact, tag-based, not numbered. */
.bolix-arch__section--white:has(.bolix-arch__split){
  padding:28px 0!important;
}
.bolix-arch__split{
  gap:24px!important;
}
.bolix-arch__split-copy{
  padding:32px 34px 30px!important;
  border-radius:24px!important;
}
.bolix-arch__capabilities{
  gap:12px!important;
}
.bolix-arch__cap{
  min-height:142px!important;
  padding:18px 20px!important;
  border-radius:19px!important;
}
.bolix-arch__cap-no{
  display:inline-flex!important;
  align-items:center!important;
  width:auto!important;
  height:26px!important;
  margin:0 0 12px!important;
  padding:0 9px!important;
  border-radius:999px!important;
  background:#fff1f2!important;
  color:#e30613!important;
  box-shadow:none!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
}
.bolix-arch__cap h3{
  margin-bottom:6px!important;
  font-size:17px!important;
}
.bolix-arch__cap p{
  font-size:13px!important;
  line-height:1.45!important;
}

/* Material directions: one hero catalogue + three clear navigation choices. */
.bolix-arch__material-grid{
  grid-template-columns:1.5fr 1fr 1fr!important;
  grid-template-rows:185px 185px!important;
  gap:14px!important;
}
.bolix-arch__material{
  padding:18px!important;
  border-radius:20px!important;
  cursor:pointer!important;
}
.bolix-arch__material:first-child{
  grid-column:1!important;
  grid-row:1 / span 2!important;
}
.bolix-arch__material:nth-child(2){
  grid-column:2!important;
  grid-row:1!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.03),rgba(0,0,0,.16)),
    repeating-linear-gradient(90deg,#e7e9e9 0 18px,#d8dcdd 18px 36px)!important;
}
.bolix-arch__material:nth-child(3){
  grid-column:3!important;
  grid-row:1!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,0,0,.2)),
    linear-gradient(135deg,#d8d2c9 0%,#bbb4aa 52%,#8f8982 100%)!important;
}
.bolix-arch__material:nth-child(4){
  grid-column:2 / span 2!important;
  grid-row:2!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.06),rgba(0,0,0,.15)),
    linear-gradient(120deg,#f1f2f2 0%,#d7dade 48%,#b7bdc2 100%)!important;
}
.bolix-arch__material b{
  font-size:16px!important;
}
.bolix-arch__material span{
  max-width:360px!important;
  font-size:11px!important;
  line-height:1.4!important;
}

/* Process: functional 1–4 sequence, equal cards. */
.bolix-arch__process{
  gap:12px!important;
  align-items:stretch!important;
}
.bolix-arch__step{
  min-height:196px!important;
  height:100%!important;
  padding:22px!important;
  border-radius:20px!important;
}
.bolix-arch__step-no{
  display:grid!important;
  place-items:center!important;
  width:36px!important;
  min-width:36px!important;
  height:36px!important;
  margin:0 0 18px!important;
  padding:0!important;
  border-radius:12px!important;
  background:#e30613!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(227,6,19,.14)!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1!important;
}
.bolix-arch__step h3{
  margin-bottom:7px!important;
  font-size:18px!important;
}
.bolix-arch__step p{
  font-size:13px!important;
  line-height:1.46!important;
}

/* "When to involve us" cards: softer and more useful than generic project types. */
.bolix-arch__projects{
  gap:14px!important;
}
.bolix-arch__project{
  min-height:205px!important;
  padding:22px!important;
  border-radius:20px!important;
}
.bolix-arch__project-tag{
  margin-bottom:24px!important;
  padding:6px 9px!important;
  background:#f2f4f5!important;
  color:#68717c!important;
  font-size:9px!important;
}
.bolix-arch__project h3{
  max-width:none!important;
  margin-bottom:7px!important;
  font-size:18px!important;
}
.bolix-arch__project p{
  max-width:none!important;
  font-size:13px!important;
  line-height:1.45!important;
}

/* CTA stays strong, but slightly less oversized. */
.bolix-arch__section--dark{
  padding:24px 0 48px!important;
}
.bolix-arch__cta{
  padding:38px 40px!important;
  border-radius:26px!important;
}

@media(max-width:1080px){
  .bolix-arch__card{min-height:220px!important}
  .bolix-arch__process{grid-template-columns:1fr 1fr!important}
  .bolix-arch__material-grid{
    grid-template-columns:1.3fr 1fr 1fr!important;
  }
}

@media(max-width:760px){
  .bolix-arch__section{padding:34px 0!important}
  .bolix-arch__head{margin-bottom:20px!important;gap:7px!important}
  .bolix-arch__card{min-height:0!important;padding:20px!important}
  .bolix-arch__card-mark{margin-bottom:14px!important}
  .bolix-arch__section--white:has(.bolix-arch__split){padding:16px 0!important}
  .bolix-arch__split-copy{padding:26px 22px!important}
  .bolix-arch__cap{min-height:0!important;padding:17px 18px!important}
  .bolix-arch__material-grid{
    grid-template-columns:1fr!important;
    grid-template-rows:220px 135px 135px 135px!important;
  }
  .bolix-arch__material:first-child,
  .bolix-arch__material:nth-child(2),
  .bolix-arch__material:nth-child(3),
  .bolix-arch__material:nth-child(4){
    grid-column:auto!important;
    grid-row:auto!important;
  }
  .bolix-arch__process{grid-template-columns:1fr!important;gap:10px!important}
  .bolix-arch__step{min-height:0!important;height:auto!important;padding:18px!important}
  .bolix-arch__step-no{margin-bottom:14px!important}
  .bolix-arch__project{min-height:0!important;padding:19px!important}
  .bolix-arch__project-tag{margin-bottom:18px!important}
  .bolix-arch__section--dark{padding:16px 0 36px!important}
  .bolix-arch__cta{padding:28px 22px!important}
}
