.recharge-bg:before {
  background-image: url("assets/connect/telecom-2026/recarga-comercio-ai-v1.png");
}

.platform-visual {
  position: relative;
  min-height: 680px;
  overflow: hidden;
  border-radius: 32px;
}

.ai-recharge-scene {
  position: absolute;
  inset: 0 0 0 10%;
  margin: 0;
  overflow: hidden;
  border: 1px solid #ffffff26;
  border-radius: 32px;
  background: #061a35;
  box-shadow: 0 35px 80px #0005;
}

.ai-recharge-scene:after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #071a33c9 0%, transparent 55%), linear-gradient(0deg, #071a33e8 0%, transparent 45%);
  content: "";
}

.ai-recharge-scene img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ai-recharge-scene figcaption {
  position: absolute;
  z-index: 2;
  right: .8rem;
  bottom: .7rem;
  padding: .4rem .6rem;
  border-radius: 999px;
  background: #061a35e8;
  color: #d7e7f2;
  font-size: .62rem;
}

.platform-visual .app-phone {
  position: absolute;
  z-index: 3;
  left: -4%;
  bottom: -2%;
  width: min(330px, 70%);
  margin: 0;
}

.jordan-platform {
  position: absolute;
  z-index: 4;
  right: -5%;
  bottom: -5%;
  width: 320px;
  height: 320px;
  object-fit: contain;
  filter: drop-shadow(0 18px 28px #0007);
}

@media (max-width: 1024px) {
  .platform-visual {
    width: min(720px, 100%);
    min-height: 720px;
    margin: auto;
  }

  .ai-recharge-scene { inset: 0 0 0 18%; }
  .platform-visual .app-phone { left: 0; }
  .jordan-platform { right: -2.5rem; bottom: -4rem; width: 330px; height: 330px; }
}

@media (max-width: 680px) {
  .platform-visual { min-height: 590px; }
  .ai-recharge-scene { inset: 0 0 8% 7%; }
  .platform-visual .app-phone { left: 0; bottom: 0; width: min(285px, 75%); }
  .jordan-platform { right: -3rem; bottom: -3rem; width: 270px; height: 270px; }
  .ai-recharge-scene figcaption { right: .45rem; bottom: .45rem; max-width: 58%; border-radius: 14px; text-align: right; }
}

.process-section {
  background: linear-gradient(180deg, #fff 0%, #eef8f8 100%);
}

.process-section .section-heading > p:last-child {
  margin: .8rem auto 0;
  color: #52677a;
}

.process-line {
  gap: .8rem;
}

.process-line li {
  min-width: 0;
  padding: 1.25rem .85rem 1.4rem;
  border: 1px solid #d4e4e8;
  border-top: 4px solid #1cbdbb;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 16px 34px #071a330d;
}

.process-line > li > span {
  margin: -2.65rem auto 0;
  box-shadow: 0 0 0 6px #eef8f8;
}

.process-jordan {
  position: relative;
  display: grid;
  min-height: 210px;
  margin-top: 1rem;
  place-items: end center;
}

.process-jordan img {
  width: 132px;
  height: 132px;
  object-fit: contain;
}

.process-line li:nth-child(even) .process-jordan img {
  transform: scaleX(-1);
}

.process-bubble {
  position: absolute;
  top: 0;
  left: 50%;
  width: min(215px, 98%);
  margin: 0;
  padding: 1rem 1.05rem;
  transform: translateX(-50%);
  border: 1px solid #bce0e3;
  border-radius: 16px 16px 16px 4px;
  background: #e9fbfa;
  color: #073f52 !important;
  font-size: .88rem !important;
  font-weight: 800;
  line-height: 1.4 !important;
  text-align: center;
}

.process-bubble:after {
  position: absolute;
  bottom: -9px;
  left: 25px;
  width: 16px;
  height: 16px;
  transform: rotate(45deg);
  border-right: 1px solid #bce0e3;
  border-bottom: 1px solid #bce0e3;
  background: #e9fbfa;
  content: "";
}

.process-line h3 {
  margin: .7rem 0 .35rem;
  text-align: center;
}

.process-line > li > p:last-child {
  margin: 0;
  text-align: center;
}

@media (max-width: 1024px) {
  .process-line { gap: 0; }
  .process-line li { display: grid; min-height: 225px; padding: 1rem 1rem 1rem 12rem; border: 1px solid #d4e4e8; border-left: 4px solid #1cbdbb; grid-template-columns: 1fr; align-content: center; }
  .process-line > li > span { top: 50%; left: -22px; margin: -21px 0 0; }
  .process-jordan { position: absolute; top: 12px; bottom: 12px; left: 1rem; width: 10rem; min-height: 0; margin: 0; }
  .process-jordan img { width: 110px; height: 110px; }
  .process-bubble { width: 205px; padding: .9rem 1rem; font-size: .84rem !important; }
  .process-line h3, .process-line > li > p:last-child { text-align: left; }
}

@media (max-width: 520px) {
  .process-line li { min-height: 300px; padding: 1rem 1rem 1.2rem; align-content: end; }
  .process-jordan { position: relative; top: auto; bottom: auto; left: auto; width: 100%; min-height: 190px; margin: 0; }
  .process-line h3, .process-line > li > p:last-child { text-align: center; }
}

/* Interactive process scenes */
.process-line .process-step {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #fff;
  background: linear-gradient(145deg, #06172d 0%, #0a3156 58%, #087f83 145%);
  border-color: #1abdbb55;
  outline: none;
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.process-line .process-step:before {
  position: absolute;
  z-index: -2;
  inset: 0;
  opacity: .48;
  background-image: linear-gradient(#3fe0db16 1px, transparent 1px), linear-gradient(90deg, #3fe0db16 1px, transparent 1px);
  background-size: 30px 30px;
  content: "";
  mask-image: linear-gradient(90deg, #000, transparent 82%);
}

.process-line .process-step:after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: radial-gradient(circle at 18% 50%, #19c5b72b, transparent 32%), linear-gradient(90deg, transparent 45%, #06172de8 73%);
  content: "";
}

.process-step:hover,
.process-step:focus-visible {
  transform: translateY(-4px);
  border-color: #60f4eb;
  box-shadow: 0 24px 48px #071a3330, 0 0 0 3px #1abdbb30;
}

.process-line .process-step > span {
  position: absolute;
  z-index: 5;
  top: 1rem;
  left: 1rem;
  margin: 0;
  background: #fff;
  color: #08233e;
  box-shadow: 0 0 0 5px #15c4bb35;
}

.process-data-flow {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.process-data-flow i {
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #65fff4;
  box-shadow: 0 0 18px #65fff4;
  animation: process-pulse 3.4s ease-in-out infinite;
}

.process-data-flow i:nth-child(1) { top: 24%; left: 12%; }
.process-data-flow i:nth-child(2) { top: 62%; left: 34%; animation-delay: -1.1s; }
.process-data-flow i:nth-child(3) { top: 38%; left: 58%; animation-delay: -2.2s; }

.process-data-flow i:after {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 160px;
  height: 1px;
  transform: rotate(18deg);
  transform-origin: left;
  background: linear-gradient(90deg, #65fff4b8, transparent);
  content: "";
}

.process-data-flow b {
  position: absolute;
  padding: .32rem .48rem;
  border: 1px solid #7df7ef38;
  border-radius: 8px;
  background: #06172d9c;
  color: #a8f4ee;
  font-size: .56rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  animation: process-drift 5.5s ease-in-out infinite;
}

.process-data-flow b:nth-of-type(1) { top: 14%; left: 24%; }
.process-data-flow b:nth-of-type(2) { top: 52%; left: 8%; animation-delay: -1.8s; }
.process-data-flow b:nth-of-type(3) { bottom: 13%; left: 38%; animation-delay: -3.5s; }

.step-review { background: linear-gradient(145deg, #07172f, #16386a 62%, #1d7490 145%) !important; }
.step-balance { background: linear-gradient(145deg, #071b31, #0b4b65 62%, #17a58c 145%) !important; }
.step-access { background: linear-gradient(145deg, #09162d, #273c72 62%, #168ca0 145%) !important; }
.step-recharge { background: linear-gradient(145deg, #06182f, #074d70 62%, #16a89b 145%) !important; }

.process-line .process-jordan {
  z-index: 2;
  overflow: hidden;
}

.process-line .process-jordan img {
  filter: drop-shadow(0 16px 20px #0008);
  transition: transform .3s ease, filter .3s ease;
}

.process-step:hover .process-jordan img,
.process-step:focus-visible .process-jordan img {
  transform: translateY(-7px) scale(1.05);
  filter: drop-shadow(0 20px 25px #000a) saturate(1.1);
}

.process-step:nth-child(even):hover .process-jordan img,
.process-step:nth-child(even):focus-visible .process-jordan img {
  transform: scaleX(-1) translateY(-7px) scale(1.05);
}

.process-line .process-bubble {
  border-color: #8ef7f0;
  background: #ecffff;
  box-shadow: 0 12px 30px #00101f66;
  transition: transform .28s ease, box-shadow .28s ease;
}

.process-step:hover .process-bubble,
.process-step:focus-visible .process-bubble {
  transform: translateX(-50%) translateY(-4px) scale(1.04);
  box-shadow: 0 16px 36px #00101f88, 0 0 0 4px #65fff426;
}

.process-copy {
  position: relative;
  z-index: 3;
}

.process-line .process-copy h3 {
  color: #fff;
}

.process-line .process-copy p {
  color: #cfe2ee;
}

@keyframes process-pulse {
  0%, 100% { opacity: .32; transform: scale(.7) translateX(0); }
  50% { opacity: 1; transform: scale(1.35) translateX(18px); }
}

@keyframes process-drift {
  0%, 100% { opacity: .38; transform: translate3d(0, 0, 0); }
  50% { opacity: .85; transform: translate3d(12px, -8px, 0); }
}

@media (min-width: 1025px) {
  .process-line .process-step { min-height: 440px; }
  .process-line .process-step:after { background: linear-gradient(0deg, #06172df5 0%, transparent 70%); }
  .process-line .process-step > span { top: .85rem; left: .85rem; }
  .process-line .process-jordan { min-height: 275px; padding-top: 3.2rem; }
  .process-line .process-jordan img { position: absolute; right: 50%; bottom: -72px; width: 290px; height: 290px; max-width: none; transform: translateX(50%); }
  .process-line .process-step:nth-child(even) .process-jordan img { transform: translateX(50%) scaleX(-1); }
  .process-line .process-copy h3, .process-line .process-copy p { text-align: center; }
}

@media (max-width: 1024px) {
  .process-line .process-step { display: grid; min-height: 340px; padding: 2rem 16rem 2rem 15rem; grid-template-columns: minmax(240px, 1fr); align-content: center; }
  .process-line .process-step:after { background: linear-gradient(90deg, transparent 30%, #06172df5 70%); }
  .process-line .process-step > span { top: 1rem; left: 1rem; margin: 0; }
  .process-line .process-jordan { left: 1.15rem; width: 13.5rem; }
  .process-line .process-jordan img { position: absolute; right: 50%; bottom: -72px; width: 315px; height: 315px; max-width: none; transform: translateX(50%); }
  .process-line .process-step:nth-child(even) .process-jordan img { transform: translateX(50%) scaleX(-1); }
  .process-line .process-copy { padding: 1.15rem 1.25rem; border: 1px solid #8cf7ef2b; border-radius: 18px; background: #06172db8; backdrop-filter: blur(8px); }
  .process-line .process-copy h3, .process-line .process-copy p { text-align: left; }
  .process-line .process-data-flow b { z-index: 2; left: auto; right: 1.25rem; width: 12rem; padding: .65rem .8rem; border-color: #7df7ef58; background: #092a48d9; color: #d6fffc; font-size: .64rem; text-align: center; box-shadow: 0 9px 24px #00101f52; }
  .process-line .process-data-flow b:nth-of-type(1) { top: 20%; }
  .process-line .process-data-flow b:nth-of-type(2) { top: 43%; }
  .process-line .process-data-flow b:nth-of-type(3) { top: 66%; bottom: auto; }
  .process-line .process-data-flow i:nth-child(1) { top: 22%; left: auto; right: 13.5rem; }
  .process-line .process-data-flow i:nth-child(2) { top: 49%; left: auto; right: 13.5rem; }
  .process-line .process-data-flow i:nth-child(3) { top: 72%; left: auto; right: 13.5rem; }
  .process-line .process-data-flow i:after { width: 80px; transform: rotate(0); }
  .process-line .process-step:nth-child(even) { padding: 2rem 15rem 2rem 16rem; }
  .process-line .process-step:nth-child(even) .process-jordan { right: 1.15rem; left: auto; }
  .process-line .process-step:nth-child(even) .process-data-flow b { right: auto; left: 1.25rem; }
  .process-line .process-step:nth-child(even) .process-data-flow i:nth-child(1),
  .process-line .process-step:nth-child(even) .process-data-flow i:nth-child(2),
  .process-line .process-step:nth-child(even) .process-data-flow i:nth-child(3) { right: auto; left: 13.5rem; }
}

@media (max-width: 520px) {
  .process-line .process-step { min-height: 460px; padding: 1rem 1rem 1.3rem; }
  .process-line .process-step:after { background: linear-gradient(0deg, #06172df7 0%, transparent 75%); }
  .process-line .process-jordan { left: auto; width: 100%; min-height: 325px; padding-top: 3.1rem; }
  .process-line .process-step:nth-child(even) { padding: 1rem 1rem 1.3rem; }
  .process-line .process-step:nth-child(even) .process-jordan { right: auto; left: auto; }
  .process-line .process-jordan img { right: 50%; bottom: -82px; width: 350px; height: 350px; max-width: none; transform: translateX(50%); }
  .process-line .process-step:nth-child(even) .process-jordan img { transform: translateX(50%) scaleX(-1); }
  .process-line .process-bubble { width: min(245px, 88%); padding: 1rem 1.1rem; font-size: .9rem !important; line-height: 1.42 !important; }
  .process-line .process-copy h3, .process-line .process-copy p { text-align: center; }
  .process-line .process-data-flow b,
  .process-line .process-step:nth-child(even) .process-data-flow b { right: auto; left: auto; width: auto; padding: .32rem .48rem; font-size: .53rem; }
  .process-line .process-data-flow b:nth-of-type(1),
  .process-line .process-step:nth-child(even) .process-data-flow b:nth-of-type(1) { top: 12%; right: 8%; left: auto; }
  .process-line .process-data-flow b:nth-of-type(2),
  .process-line .process-step:nth-child(even) .process-data-flow b:nth-of-type(2) { top: 28%; right: auto; left: 8%; }
  .process-line .process-data-flow b:nth-of-type(3),
  .process-line .process-step:nth-child(even) .process-data-flow b:nth-of-type(3) { top: 43%; right: 6%; bottom: auto; left: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .process-data-flow i,
  .process-data-flow b { animation: none; }
  .process-step,
  .process-jordan img,
  .process-bubble { transition: none; }
}

.process-step:hover .process-jordan img,
.process-step:focus-visible .process-jordan img {
  transform: translateX(50%) translateY(-7px) scale(1.05);
}

.process-step:nth-child(even):hover .process-jordan img,
.process-step:nth-child(even):focus-visible .process-jordan img {
  transform: translateX(50%) translateY(-7px) scaleX(-1) scale(1.05);
}

/* CONNECTIO presents the four real chip products */
.real-chip-grid .chip-story {
  overflow: hidden;
  padding: 0;
  border-color: #173c5a;
  background: #06182f;
  box-shadow: 0 20px 45px #071a3326;
  transition: transform .28s ease, box-shadow .28s ease;
}

.real-chip-grid .chip-story:hover,
.real-chip-grid .chip-story:focus-within {
  transform: translateY(-7px);
  box-shadow: 0 28px 55px #071a3340;
}

.chip-mascot-scene {
  position: relative;
  isolation: isolate;
  height: 390px;
  overflow: hidden;
  background: radial-gradient(circle at 50% 32%, #1bbec641, transparent 35%), linear-gradient(150deg, #071a33, #0b4267 72%, #0a8d89);
}

.chip-mascot-scene:before {
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .5;
  background-image: linear-gradient(#8ffbf21c 1px, transparent 1px), linear-gradient(90deg, #8ffbf21c 1px, transparent 1px);
  background-size: 26px 26px;
  content: "";
  mask-image: linear-gradient(#000, transparent 92%);
}

.real-chip-grid .connectio-chip-mascot {
  position: absolute;
  z-index: 2;
  right: 50%;
  bottom: -82px;
  width: 340px;
  height: 340px;
  max-width: none;
  transform: translateX(50%);
  object-fit: contain;
  filter: drop-shadow(0 20px 25px #0008);
  transition: transform .3s ease;
}

.real-chip-grid .chip-in-hand {
  position: absolute;
  z-index: 4;
  width: 118px;
  height: 150px;
  padding: .55rem;
  border: 1px solid #ffffff78;
  border-radius: 18px;
  background: #fffffff2;
  object-fit: contain;
  filter: drop-shadow(0 16px 24px #00101f99);
  animation: chip-float 3.8s ease-in-out infinite;
}

.chip-entel .chip-in-hand { top: 128px; right: 8px; transform: rotate(7deg); }
.chip-claro .chip-in-hand { top: 108px; left: 9px; transform: rotate(-8deg); animation-delay: -.8s; }
.chip-wom .chip-in-hand { top: 142px; right: 5px; transform: rotate(10deg); animation-delay: -1.6s; }
.chip-movistar .chip-in-hand { top: 112px; left: 8px; transform: rotate(-6deg); animation-delay: -2.4s; }

.chip-callout {
  position: absolute;
  z-index: 5;
  top: 18px;
  left: 50%;
  width: max-content;
  max-width: 88%;
  padding: .65rem .8rem;
  transform: translateX(-50%);
  border: 1px solid #8df7ef78;
  border-radius: 14px 14px 14px 4px;
  background: #eafffdf2;
  color: #073c4c;
  font-size: .72rem;
  font-weight: 800;
  text-align: center;
  box-shadow: 0 12px 24px #00101f75;
}

.chip-callout:after {
  position: absolute;
  bottom: -8px;
  left: 24px;
  width: 14px;
  height: 14px;
  transform: rotate(45deg);
  border-right: 1px solid #8df7ef78;
  border-bottom: 1px solid #8df7ef78;
  background: #eafffdf2;
  content: "";
}

.chip-orbit {
  position: absolute;
  z-index: 1;
  inset: 68px 18px 28px;
  border: 1px solid #55e7e14a;
  border-radius: 50%;
  animation: chip-orbit-spin 12s linear infinite;
}

.chip-orbit i {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #74fff5;
  box-shadow: 0 0 17px #74fff5;
}

.chip-orbit i:nth-child(1) { top: 4%; left: 50%; }
.chip-orbit i:nth-child(2) { right: 7%; bottom: 22%; }
.chip-orbit i:nth-child(3) { bottom: 8%; left: 20%; }

.real-chip-grid .chip-story figcaption {
  display: grid;
  min-height: 105px;
  margin: 0;
  padding: 1rem 1.1rem;
  background: #06182f;
  color: #fff;
  text-align: left;
  align-content: center;
  gap: .28rem;
}

.real-chip-grid .chip-story figcaption strong {
  font-size: 1.25rem;
}

.real-chip-grid .chip-story figcaption span {
  color: #b9ccda;
  font-size: .65rem;
  font-weight: 500;
  line-height: 1.4;
}

.chip-story:hover .connectio-chip-mascot {
  transform: translateX(50%) translateY(-8px) scale(1.04);
}

@keyframes chip-float {
  0%, 100% { margin-top: 0; }
  50% { margin-top: -10px; }
}

@keyframes chip-orbit-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 1024px) {
  .chip-mascot-scene { height: 430px; }
  .real-chip-grid .connectio-chip-mascot { width: 390px; height: 390px; }
  .real-chip-grid .chip-in-hand { width: 138px; height: 174px; }
}

@media (max-width: 680px) {
  .chip-mascot-scene { height: 390px; }
  .real-chip-grid .connectio-chip-mascot { width: 350px; height: 350px; }
  .real-chip-grid .chip-in-hand { width: 120px; height: 154px; }
  .real-chip-grid .chip-story figcaption { min-height: 98px; }
}

@media (prefers-reduced-motion: reduce) {
  .chip-orbit,
  .real-chip-grid .chip-in-hand { animation: none; }
}

/* AI hand poses + untouched official product artwork */
.real-chip-grid .connectio-chip-mascot {
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  transform: none;
  object-fit: cover;
  filter: none;
}

.real-chip-grid .chip-in-hand {
  height: auto;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: transparent;
  object-fit: cover;
  filter: none;
  animation: chip-in-hand-breathe 3.8s ease-in-out infinite;
  clip-path: inset(3% 4% 3% 4% round 4px);
}

.chip-entel .chip-in-hand { top: 48%; right: auto; left: 56.2%; width: 21.7%; transform: none; }
.chip-claro .chip-in-hand { top: 34%; right: auto; left: 70%; width: 21%; transform: none; animation-delay: -.8s; }
.chip-wom .chip-in-hand { top: 40%; right: auto; left: 20%; width: 22%; transform: none; animation-delay: -1.6s; }
.chip-movistar .chip-in-hand { top: 25%; right: auto; left: 12%; width: 24%; transform: none; animation-delay: -2.4s; }

.chip-callout {
  padding: .9rem 1rem;
  font-size: 1rem;
  line-height: 1.35;
}

.real-chip-grid .chip-story figcaption {
  min-height: 145px;
  padding: 1.25rem 1.3rem;
}

.real-chip-grid .chip-story figcaption strong {
  font-size: 1.75rem;
  line-height: 1.1;
}

.real-chip-grid .chip-story figcaption span {
  font-size: .95rem;
  line-height: 1.52;
}

.chip-story:hover .connectio-chip-mascot {
  transform: scale(1.025);
}

@keyframes chip-in-hand-breathe {
  0%, 100% { scale: 1; }
  50% { scale: 1.035; }
}

@media (max-width: 1024px) {
  .real-chip-grid .connectio-chip-mascot { width: 100%; height: 100%; }
  .real-chip-grid .chip-in-hand { height: auto; }
  .chip-callout { font-size: .95rem; }
  .real-chip-grid .chip-story figcaption strong { font-size: 1.7rem; }
  .real-chip-grid .chip-story figcaption span { font-size: .88rem; }
}

@media (max-width: 680px) {
  .real-chip-grid .connectio-chip-mascot { width: 100%; height: 100%; }
  .real-chip-grid .chip-in-hand { height: auto; }
  .chip-callout { width: min(230px, 86%); max-width: none; font-size: .92rem; }
  .real-chip-grid .chip-story figcaption { min-height: 128px; }
  .real-chip-grid .chip-story figcaption strong { font-size: 1.65rem; }
  .real-chip-grid .chip-story figcaption span { font-size: .86rem; }
}
/* Tarjetas visuales para orientar cada necesidad. Las imágenes son composiciones conceptuales creadas con IA. */
.telecom-needs a {
  position: relative;
  min-height: 280px;
  overflow: hidden;
  padding: 0;
  border-color: #163d63;
  background: #071a33;
  color: #fff;
  isolation: isolate;
  align-content: end;
}
.telecom-needs a::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, transparent 26%, #04132680 58%, #041326f5 100%);
  content: "";
}
.telecom-needs .need-card-image {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}
.telecom-needs a:hover .need-card-image { transform: scale(1.045); }
.telecom-needs .need-ai-label {
  position: absolute;
  top: .65rem;
  left: .65rem;
  margin: 0;
  padding: .38rem .55rem;
  border: 1px solid #ffffff4a;
  border-radius: 999px;
  background: #041326c9;
  color: #d9faff;
  font-size: .58rem;
  letter-spacing: .04em;
  line-height: 1;
}
.telecom-needs .need-card-copy {
  position: relative;
  z-index: 1;
  display: grid;
  margin: 0;
  padding: 4.6rem 1rem 1rem;
  color: #fff;
}
.telecom-needs .need-card-copy strong {
  margin: 0;
  color: #fff;
  font-size: 1.02rem;
  line-height: 1.12;
}
.telecom-needs .need-card-copy > span {
  margin-top: .45rem;
  color: #73edf0;
  font-size: .78rem;
}
@media (max-width: 1024px) {
  .telecom-needs a { min-height: 300px; }
}
@media (max-width: 680px) {
  .telecom-needs a { min-height: 240px; }
}
@media (max-width: 390px) {
  .telecom-needs a { min-height: 310px; }
}