/* why-viliante-section-css */

.why-viliante-section{
  position:relative;
  overflow:hidden;
  padding:130px 0;
  background:
    radial-gradient(circle at 82% 18%, rgba(43,93,191,.08), transparent 34%),
    radial-gradient(circle at 18% 82%, rgba(220,190,145,.16), transparent 40%),
    linear-gradient(135deg,#fffaf2 0%,#ffffff 52%,#f7f1e8 100%);
}

.why-viliante-bg-glow{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 75% 25%, rgba(64,120,255,.08), transparent 24%);
}

.why-viliante-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(320px,540px) minmax(320px,1fr);
  gap:72px;
  align-items:center;
}

.why-viliante-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(43,93,191,.12);
  color:#2f6fb2;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.why-viliante-left h2{
  margin:26px 0 0;
  font-size:clamp(3.4rem,5.6vw,6.6rem);
  line-height:.96;
  letter-spacing:-.05em;
  color:#183b67;
}

.why-viliante-copy{
  margin:30px 0 0;
  max-width:46ch;
  color:#61738a;
  font-size:1.08rem;
  line-height:1.9;
}

.why-viliante-quote{
  margin-top:36px;
  padding-left:18px;
  border-left:3px solid rgba(47,111,178,.34);
  color:#214f87;
  font-size:1.02rem;
  line-height:1.7;
  max-width:42ch;
}

.why-viliante-right{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.why-card{
  position:relative;
  overflow:hidden;
  padding:28px;
  border-radius:32px;
  background:rgba(255,255,255,.68);
  border:1px solid rgba(255,255,255,.84);
  backdrop-filter:blur(18px);
  box-shadow:
    0 22px 60px rgba(16,35,63,.10),
    inset 0 1px 0 rgba(255,255,255,.82);

  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.why-card:hover{
  transform:translateY(-8px);
  box-shadow:
    0 34px 84px rgba(16,35,63,.14),
    inset 0 1px 0 rgba(255,255,255,.92);

  border-color:rgba(47,111,178,.18);
}

.why-card-icon{
  width:44px;
  height:44px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#2f6fb2,#73a7ff);
  color:#fff;
  font-size:.78rem;
  font-weight:900;
  box-shadow:
    0 12px 28px rgba(47,111,178,.24),
    0 0 0 8px rgba(47,111,178,.08);
}

.why-card h3{
  margin:22px 0 0;
  font-size:1.42rem;
  line-height:1.15;
  color:#183b67;
}

.why-card p{
  margin:14px 0 0;
  color:#64758b;
  line-height:1.7;
  font-size:.98rem;
}

@media(max-width:980px){

  .why-viliante-section{
    padding:90px 0;
  }

  .why-viliante-grid{
    grid-template-columns:1fr;
    gap:42px;
  }

  .why-viliante-right{
    grid-template-columns:1fr;
  }

  .why-viliante-left h2{
    font-size:clamp(3rem,13vw,5rem);
  }
}


/* why-video-bg-section-css-v1 */

.why-video-bg-section {
  position: relative;
  min-height: 86vh;
  overflow: hidden;
  padding: 105px 0 95px;
  background: #fffaf2;
}

.why-bg-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .68;
  filter: brightness(1.02) contrast(1.02) saturate(.96);
  z-index: 0;
}

.why-bg-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(255,250,242,.66) 0%, rgba(255,250,242,.46) 45%, rgba(255,250,242,.24) 100%),
    linear-gradient(180deg, rgba(255,250,242,.30), rgba(255,250,242,.14));
}

.why-video-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(320px, 540px) minmax(320px, 1fr);
  gap: 62px;
  align-items: center;
}

.why-video-kicker {
  display: inline-flex;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(255,255,255,.78);
  color: #2f6fb2;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-size: .78rem;
  backdrop-filter: blur(12px);
}

.why-video-text h2 {
  margin: 26px 0 0;
  color: #183b67;
  font-size: clamp(3.3rem, 5.4vw, 6.4rem);
  line-height: .96;
  letter-spacing: -.05em;
}

.why-video-text p {
  margin: 30px 0 0;
  max-width: 46ch;
  color: #4f5f73;
  font-size: 1.08rem;
  line-height: 1.85;
}

.why-video-quote {
  margin-top: 34px;
  max-width: 42ch;
  padding-left: 18px;
  border-left: 3px solid rgba(47,111,178,.34);
  color: #214f87;
  font-size: 1.02rem;
  line-height: 1.7;
}

.why-video-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px;
}

.why-video-cards article {
  padding: 26px;
  border-radius: 30px;
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(255,255,255,.78);
  box-shadow: 0 22px 60px rgba(16,35,63,.12);
  backdrop-filter: blur(16px);
  transition: transform .28s ease, box-shadow .28s ease;
}

.why-video-cards article:hover {
  transform: translateY(-7px);
  box-shadow: 0 32px 78px rgba(16,35,63,.16);
}

.why-video-cards strong {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: #2f6fb2;
  color: #fff;
  font-weight: 900;
  margin-bottom: 16px;
}

.why-video-cards h3 {
  margin: 0;
  color: #183b67;
  font-size: 1.34rem;
}

.why-video-cards p {
  margin: 12px 0 0;
  color: #5f6f82;
  line-height: 1.6;
}

@media (max-width: 900px) {
  .why-video-bg-section {
    min-height: auto;
    padding: 80px 0;
  }

  .why-bg-video {
    opacity: .46;
  }

  .why-bg-overlay {
    background: rgba(255,250,242,.56);
  }

  .why-video-content {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .why-video-cards {
    grid-template-columns: 1fr;
  }

  .why-video-text h2 {
    font-size: clamp(3rem, 13vw, 5rem);
  }
}


/* why-compact-section-css */

.why-compact-section {
  position: relative;
  padding: 82px 0 88px;
  background:
    radial-gradient(circle at 0% 10%, rgba(47,111,178,0.10), transparent 34%),
    radial-gradient(circle at 100% 90%, rgba(47,111,178,0.08), transparent 34%),
    linear-gradient(180deg, #fffaf2 0%, #ffffff 100%);
  overflow: hidden;
}

.why-compact-inner {
  text-align: center;
  max-width: 980px;
}

.why-compact-kicker {
  display: inline-flex;
  padding: 10px 18px;
  border-radius: 999px;
  background: rgba(255,255,255,0.82);
  border: 1px solid rgba(43,93,191,0.14);
  color: #2f6fb2;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  box-shadow: 0 12px 34px rgba(16,35,63,0.06);
}

.why-compact-section h2 {
  margin: 28px 0 0;
  color: #183b67;
  font-size: clamp(2.8rem, 4.8vw, 5.3rem);
  line-height: 1;
  letter-spacing: -0.045em;
}

.why-compact-section p {
  margin: 28px auto 0;
  max-width: 760px;
  color: #4f5f73;
  font-size: clamp(1.1rem, 1.45vw, 1.38rem);
  line-height: 1.72;
}

@media (max-width: 768px) {
  .why-compact-section {
    padding: 62px 0 68px;
  }

  .why-compact-section h2 {
    font-size: clamp(2.5rem, 11vw, 4rem);
  }

  .why-compact-section p {
    font-size: 1.03rem;
  }
}
