/*
Theme Name: JTelecom Salient
Theme URI: https://demowp.forall.es
Description: Child theme for the JTelecom WooCommerce storefront.
Author: ForAll
Template: salient
Version: 1.0.0
Text Domain: jtelecom-salient
*/

:root {
  --demowp-ink: #101828;
  --demowp-muted: #5d6678;
  --demowp-blue: #1457ff;
  --demowp-cyan: #00b8d9;
  --demowp-lime: #b8ff4d;
  --demowp-soft: #f4f8fb;
  --demowp-line: #dce7f1;
  --demowp-radius: 8px;
}

body {
  color: var(--demowp-ink);
  background:
    radial-gradient(circle at 18% 8%, rgba(0, 184, 217, .18), transparent 26rem),
    linear-gradient(180deg, #ffffff 0%, #f7fbff 52%, #ffffff 100%);
}

body,
button,
input,
select,
textarea {
  letter-spacing: 0;
}

#header-outer {
  border-bottom: 1px solid rgba(16, 24, 40, .08);
  box-shadow: 0 16px 48px rgba(16, 24, 40, .08);
}

#header-outer[data-transparent-header="true"].transparent {
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(18px);
}

#top nav > ul > li > a,
#top .span_9 > .slide-out-widget-area-toggle a {
  font-weight: 800;
}

#top nav > ul > li[class*="current"] > a,
#top nav > ul > li > a:hover {
  color: var(--demowp-blue) !important;
}

.container-wrap {
  background: transparent;
}

.demowp-home {
  color: var(--demowp-ink);
}

.demowp-hero {
  position: relative;
  overflow: hidden;
  margin-top: 18px;
  padding: clamp(54px, 8vw, 86px) clamp(22px, 5vw, 58px);
  border: 1px solid rgba(20, 87, 255, .16);
  border-radius: var(--demowp-radius);
  background:
    linear-gradient(135deg, rgba(20, 87, 255, .1), rgba(0, 184, 217, .08) 40%, rgba(184, 255, 77, .13)),
    #ffffff;
  box-shadow: 0 28px 90px rgba(20, 87, 255, .14);
}

.demowp-hero::after {
  content: "";
  position: absolute;
  right: clamp(10px, 4vw, 44px);
  bottom: -82px;
  width: min(38vw, 410px);
  height: min(38vw, 410px);
  border-radius: 50%;
  background:
    linear-gradient(145deg, rgba(20, 87, 255, .18), rgba(0, 184, 217, .16)),
    repeating-linear-gradient(90deg, transparent 0 18px, rgba(255,255,255,.65) 18px 20px);
  opacity: .8;
  pointer-events: none;
}

.demowp-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid rgba(20, 87, 255, .16);
  border-radius: 999px;
  background: rgba(255,255,255,.76);
  color: var(--demowp-blue) !important;
}

.demowp-kicker::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--demowp-lime);
  box-shadow: 0 0 0 5px rgba(184, 255, 77, .28);
}

.demowp-hero h1 {
  max-width: 870px;
  font-weight: 900;
  color: var(--demowp-ink);
}

.demowp-hero p:not(.demowp-kicker) {
  color: var(--demowp-muted);
}

.demowp-device {
  border-radius: var(--demowp-radius);
  background:
    linear-gradient(145deg, #101828, #1457ff 55%, #00b8d9);
  box-shadow: 0 24px 70px rgba(16, 24, 40, .25);
}

.demowp-phone {
  transform: rotate(-6deg);
  transition: transform .25s ease;
}

.demowp-device:hover .demowp-phone {
  transform: rotate(-2deg) translateY(-6px);
}

.demowp-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce #payment #place_order {
  border-radius: 7px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.demowp-btn.primary,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce #payment #place_order {
  background: linear-gradient(135deg, var(--demowp-blue), #00a5c8) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 34px rgba(20, 87, 255, .24);
}

.demowp-btn:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  transform: translateY(-2px);
}

.demowp-band {
  border-bottom: 0;
}

.demowp-band h2,
.woocommerce-products-header__title,
.related.products h2,
.upsells.products h2 {
  font-weight: 900;
  color: var(--demowp-ink);
}

.demowp-feature,
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  border: 1px solid rgba(16, 24, 40, .09);
  border-radius: var(--demowp-radius);
  background: rgba(255,255,255,.86);
  box-shadow: 0 18px 52px rgba(16, 24, 40, .08);
}

.demowp-feature {
  transition: transform .18s ease, box-shadow .18s ease;
}

.demowp-feature:hover,
.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 70px rgba(16, 24, 40, .13);
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  overflow: hidden;
  padding: 14px 14px 18px !important;
}

.woocommerce ul.products li.product a img {
  border-radius: 7px;
  background: var(--demowp-soft);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  min-height: 2.6em;
  color: var(--demowp-ink);
  font-weight: 900;
}

.woocommerce ul.products li.product .price {
  color: var(--demowp-blue) !important;
  font-weight: 900 !important;
}

.woocommerce ul.products li.product .jtelecom-view-product {
  display: inline-flex !important;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  margin-top: 12px !important;
  text-align: center;
}

.woocommerce span.onsale {
  border-radius: 999px;
  background: var(--demowp-lime) !important;
  color: var(--demowp-ink) !important;
  font-weight: 900;
}

.woocommerce-account .woocommerce,
.woocommerce-cart .woocommerce,
.woocommerce-checkout .woocommerce {
  padding: clamp(18px, 4vw, 34px);
  border: 1px solid rgba(16, 24, 40, .09);
  border-radius: var(--demowp-radius);
  background: #ffffff;
  box-shadow: 0 18px 52px rgba(16, 24, 40, .08);
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  border-radius: 7px;
  border-color: var(--demowp-line);
}

@media (max-width: 780px) {
  .demowp-hero {
    margin-top: 0;
    padding: 36px 18px;
  }

  .demowp-hero::after {
    width: 260px;
    height: 260px;
  }

  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product {
    padding: 12px !important;
  }
}

.jtelecom-home {
  --jt-blue: #076cff;
  --jt-blue-2: #0aa7ff;
  --jt-ink: #050814;
  --jt-panel: rgba(255,255,255,.08);
  --jt-line: rgba(255,255,255,.16);
  color: #ffffff;
  background: #050814;
}

.jtelecom-section {
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(54px, 8vw, 96px) 22px;
}

.jtelecom-hero {
  min-height: min(760px, 86vh);
  display: flex;
  align-items: center;
  background:
    linear-gradient(90deg, rgba(5,8,20,.92) 0%, rgba(5,8,20,.74) 38%, rgba(5,8,20,.1) 70%),
    var(--jt-hero) center/cover no-repeat;
}

.jtelecom-hero__content {
  max-width: 620px;
}

.jtelecom-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 20px;
  color: #7ab8ff;
  font-weight: 900;
  text-transform: uppercase;
}

.jtelecom-eyebrow::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #0b6cff;
  box-shadow: 0 0 0 7px rgba(11,108,255,.2);
}

.jtelecom-hero h1,
.jtelecom-section h2 {
  margin: 0;
  color: #ffffff;
  font-weight: 900;
  letter-spacing: 0;
}

.jtelecom-hero h1 {
  max-width: 720px;
  font-size: clamp(46px, 8vw, 92px);
  line-height: .98;
}

.jtelecom-hero p {
  max-width: 560px;
  margin: 24px 0 0;
  color: rgba(255,255,255,.78);
  font-size: 20px;
  line-height: 1.55;
}

.jtelecom-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 34px;
}

.jtelecom-button {
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  padding: 0 22px;
  border-radius: 8px;
  color: #ffffff;
  font-weight: 900;
  text-decoration: none;
}

.jtelecom-button.primary {
  background: linear-gradient(135deg, #076cff, #0aa7ff);
  box-shadow: 0 18px 44px rgba(7,108,255,.38);
}

.jtelecom-button.secondary {
  border: 1px solid rgba(255,255,255,.2);
  background: rgba(255,255,255,.08);
}

.jtelecom-proof {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 46px;
}

.jtelecom-proof span,
.jtelecom-offer,
.jtelecom-card {
  border: 1px solid var(--jt-line);
  border-radius: 8px;
  background: var(--jt-panel);
  backdrop-filter: blur(14px);
}

.jtelecom-proof span {
  padding: 16px;
  color: rgba(255,255,255,.84);
  font-weight: 800;
}

.jtelecom-section.light {
  color: var(--demowp-ink);
  background: #ffffff;
}

.jtelecom-section.light h2,
.jtelecom-section.light h3 {
  color: var(--demowp-ink);
}

.jtelecom-section__head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 28px;
}

.jtelecom-section__head p {
  max-width: 520px;
  margin: 0;
  color: var(--demowp-muted);
  line-height: 1.55;
}

.jtelecom-offers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.jtelecom-offer {
  min-height: 430px;
  overflow: hidden;
  color: #ffffff;
  background: #050814;
}

.jtelecom-offer img {
  width: 100%;
  height: 100%;
  min-height: 430px;
  object-fit: cover;
  transition: transform .24s ease;
}

.jtelecom-offer:hover img {
  transform: scale(1.03);
}

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

.jtelecom-card {
  padding: 24px;
  color: #ffffff;
}

.jtelecom-card strong {
  display: block;
  margin-bottom: 8px;
  color: #ffffff;
  font-size: 22px;
}

.jtelecom-card p {
  margin: 0;
  color: rgba(255,255,255,.72);
  line-height: 1.55;
}

.jtelecom-home .woocommerce ul.products li.product {
  background: #ffffff;
}

#copyright .social,
#footer-outer .nectar-social {
  display: none !important;
}

.jtelecom-home + .woocommerce,
.jtelecom-products {
  max-width: 1240px;
  margin: 0 auto;
  padding: 20px 22px 76px;
}

@media (max-width: 900px) {
  .jtelecom-hero {
    min-height: auto;
    padding-top: 72px;
    background:
      linear-gradient(180deg, rgba(5,8,20,.9), rgba(5,8,20,.62)),
      var(--jt-hero) center/cover no-repeat;
  }

  .jtelecom-proof,
  .jtelecom-offers,
  .jtelecom-cards {
    grid-template-columns: 1fr;
  }

  .jtelecom-section__head {
    display: block;
  }

  .jtelecom-section__head p {
    margin-top: 12px;
  }
}