/* Pricing sheet — one clear idea, restrained platform marks and strong price hierarchy. */
.site-shell .pricing-section {
  position:relative;
  min-height:780px;
  padding:170px 0;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 20%,rgba(51,205,190,.12),transparent 25%),
    linear-gradient(135deg,#f7fbfe 0%,#f3faf8 55%,#f8fbfd 100%);
}
.site-shell .pricing-section::before {
  content:"";
  position:absolute;
  inset:0;
  display:block;
  background:linear-gradient(90deg,transparent 49.95%,rgba(126,158,180,.13) 50%,transparent 50.05%);
  pointer-events:none;
}
.site-shell .pricing-glow {
  position:absolute;
  right:-190px;
  bottom:-330px;
  width:760px;
  height:760px;
  border:1px solid rgba(32,171,183,.12);
  border-radius:50%;
  box-shadow:0 0 0 110px rgba(30,126,238,.025),0 0 0 220px rgba(33,198,174,.018);
  pointer-events:none;
}
.site-shell .pricing-layout {
  position:relative;
  z-index:1;
  grid-template-columns:minmax(0,.78fr) minmax(520px,1.22fr);
  gap:140px;
  align-items:center;
}
.site-shell .pricing-copy { max-width:510px; }
.site-shell .pricing-copy h2 {
  max-width:500px;
  margin-top:18px;
  font-family:"Inter Tight","Plus Jakarta Sans",system-ui,sans-serif;
  font-size:clamp(48px,4.25vw,66px);
  font-weight:700;
  line-height:.98;
  letter-spacing:-.055em;
}
.site-shell .pricing-copy .section-copy { max-width:430px; margin-top:25px; line-height:1.75; }
.site-shell .pricing-copy .text-link { margin-top:31px; }

.site-shell .price-panel.price-sheet {
  position:relative;
  padding:0 42px 28px;
  overflow:hidden;
  border:1px solid rgba(157,183,199,.34);
  border-radius:28px;
  background:rgba(255,255,255,.84);
  box-shadow:0 34px 90px rgba(31,79,104,.12),inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter:blur(18px);
  transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease;
}
.site-shell .price-panel.price-sheet::before {
  content:"";
  position:absolute;
  top:0;
  left:42px;
  right:42px;
  height:3px;
  border-radius:0 0 8px 8px;
  background:linear-gradient(90deg,#1678f2,#22c6ad);
}
.site-shell .price-panel.price-sheet:hover {
  transform:translateY(-7px);
  box-shadow:0 42px 105px rgba(31,79,104,.16),inset 0 1px 0 rgba(255,255,255,.9);
}
.site-shell .price-sheet-head {
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #dce7ec;
}
.site-shell .price-sheet .price-label {
  padding:0;
  color:#4f6777;
  font-size:11px;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.site-shell .price-currency {
  color:#8a9aa6;
  font-size:10px;
  font-weight:800;
  letter-spacing:.16em;
}
.site-shell .price-sheet .price-row {
  min-height:126px;
  padding:0;
  border-top:0;
  border-bottom:1px solid #dce7ec;
  transition:transform .28s ease,background .28s ease;
}
.site-shell .price-sheet .price-row:hover {
  padding-inline:0;
  border-radius:0;
  background:transparent;
  transform:translateX(7px);
}
.site-shell .price-service {
  display:flex;
  align-items:center;
  gap:17px;
  min-width:0;
}
.site-shell .price-platform {
  width:52px;
  height:52px;
  flex:0 0 52px;
  display:grid;
  place-items:center;
  padding:11px;
  border:1px solid #dde7ed;
  border-radius:15px;
  background:#fff;
  box-shadow:0 9px 22px rgba(35,74,98,.07);
}
.site-shell .price-platform svg { width:100%; height:100%; display:block; }
.site-shell .price-service>div {
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
  gap:7px;
}
.site-shell .price-service>div>strong {
  color:#10233d;
  font-size:15px;
  font-weight:750;
  letter-spacing:-.025em;
}
.site-shell .price-service small {
  color:#82929f;
  font-size:10px;
  font-weight:650;
  letter-spacing:.01em;
}
.site-shell .price-sheet .price-value {
  flex:none;
  color:#0b2c4d;
  font-family:"Inter Tight","Plus Jakarta Sans",system-ui,sans-serif;
  font-size:31px;
  font-weight:700;
  line-height:1;
  letter-spacing:-.055em;
}
.site-shell .price-sheet .price-note {
  margin:25px 0 0;
  color:#80909d;
  font-size:10px;
  line-height:1.6;
}

@media (prefers-color-scheme:dark) and (scripting:none) {
  .site-shell .pricing-section {
    background:radial-gradient(circle at 82% 20%,rgba(31,190,177,.1),transparent 25%),linear-gradient(135deg,#0c1725,#10252a 55%,#0d1927);
  }
  .site-shell .price-panel.price-sheet { border-color:rgba(147,181,199,.17); background:rgba(15,30,44,.78); box-shadow:0 34px 90px rgba(0,0,0,.28); }
  .site-shell .price-sheet-head,.site-shell .price-sheet .price-row { border-color:rgba(151,182,198,.16); }
  .site-shell .price-platform { border-color:rgba(149,179,197,.2); background:#fff; }
  .site-shell .price-service>div>strong,.site-shell .price-sheet .price-value { color:#f1f7fb; }
  .site-shell .price-sheet .price-label { color:#a9bbc7; }
}

@media (max-width:1000px) {
  .site-shell .pricing-section { min-height:0; padding:126px 0; }
  .site-shell .pricing-layout { grid-template-columns:1fr; gap:68px; }
  .site-shell .pricing-copy { max-width:620px; }
  .site-shell .price-panel.price-sheet { max-width:720px; }
}
@media (max-width:700px) {
  .site-shell .pricing-section { padding:96px 0; }
  .site-shell .pricing-section::before { display:none; }
  .site-shell .pricing-layout { gap:46px; }
  .site-shell .pricing-copy h2 { font-size:45px; }
  .site-shell .price-panel.price-sheet { padding:0 22px 23px; border-radius:22px; }
  .site-shell .price-panel.price-sheet::before { left:22px; right:22px; }
  .site-shell .price-sheet-head { min-height:70px; }
  .site-shell .price-sheet .price-row { min-height:108px; gap:18px; }
  .site-shell .price-platform { width:46px; height:46px; flex-basis:46px; padding:10px; border-radius:13px; }
  .site-shell .price-service { gap:13px; }
  .site-shell .price-service>div>strong { max-width:130px; font-size:13px; }
  .site-shell .price-sheet .price-value { font-size:25px; }
}

/* Why Ongmatmedia — continuous atmosphere instead of a hard 50/50 split. */
.site-shell .why-section {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(ellipse 52% 74% at 82% 42%,rgba(37,199,181,.12),transparent 70%),
    radial-gradient(ellipse 45% 60% at 12% 105%,rgba(32,121,238,.1),transparent 72%),
    linear-gradient(128deg,#fbfdff 0%,#f5fafe 47%,#f1faf8 100%);
}
.site-shell .why-section::before {
  content:"";
  position:absolute;
  z-index:-1;
  top:-360px;
  right:-180px;
  bottom:auto;
  left:auto;
  display:block;
  width:900px;
  height:900px;
  border:1px solid rgba(27,164,181,.1);
  border-radius:50%;
  background:transparent;
  box-shadow:0 0 0 120px rgba(34,126,237,.018),0 0 0 240px rgba(37,198,177,.014);
  pointer-events:none;
}
.site-shell .why-section::after {
  content:"";
  position:absolute;
  z-index:-1;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(37,123,235,.24),rgba(27,190,168,.24),transparent);
  pointer-events:none;
}
.site-shell .why-layout { position:relative; z-index:1; }
.site-shell .why-proof {
  position:relative;
  padding:35px 38px 22px;
  border:1px solid rgba(153,183,199,.28);
  border-radius:26px;
  background:rgba(255,255,255,.55);
  box-shadow:0 28px 80px rgba(31,78,105,.08),inset 0 1px 0 rgba(255,255,255,.8);
  backdrop-filter:blur(14px);
}
.site-shell .why-proof::before {
  content:"";
  position:absolute;
  top:0;
  left:38px;
  width:84px;
  height:3px;
  border-radius:0 0 8px 8px;
  background:linear-gradient(90deg,#1479ee,#23c6ad);
}
.site-shell .why-proof::after { display:none; }

@media (prefers-color-scheme:dark) and (scripting:none) {
  .site-shell .why-section {
    background:
      radial-gradient(ellipse 52% 74% at 82% 42%,rgba(28,185,169,.09),transparent 70%),
      radial-gradient(ellipse 45% 60% at 12% 105%,rgba(28,113,218,.09),transparent 72%),
      linear-gradient(128deg,#0b1421,#0e1d2a 48%,#0d2428);
  }
  .site-shell .why-proof {
    border-color:rgba(148,184,201,.16);
    background:rgba(13,29,43,.56);
    box-shadow:0 28px 80px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.035);
  }
}

@media (max-width:1000px) {
  .site-shell .why-section {
    background:
      radial-gradient(ellipse 80% 52% at 75% 80%,rgba(37,199,181,.1),transparent 72%),
      linear-gradient(160deg,#fbfdff,#f2f9fb);
  }
}
@media (max-width:700px) {
  .site-shell .why-section::before { width:560px; height:560px; top:auto; right:-330px; bottom:-170px; }
  .site-shell .why-proof { padding:29px 23px 16px; border-radius:22px; }
  .site-shell .why-proof::before { left:23px; }
}
