/* RIMATEL — telecom illustrations & motion */

.rt-fx-mesh {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
  contain: paint layout strict;
  max-width: 100%;
  opacity: 0.18;
}
.rt-hero > .rt-container:not(.rt-hero__chrome),
.rt-hero > .rt-container.rt-hero__viewport {
  position: relative;
  z-index: 2;
}
.rt-hero .rt-h1,
.rt-hero .rt-lead,
.rt-hero .rt-eyebrow,
.rt-hero .rt-hero__actions,
.rt-hero .rt-hero__trust {
  position: relative;
  z-index: 2;
}
.rt-hero:not(.rt-hero--slider) .rt-h1 { color: #0b1220 !important; }
.rt-hero:not(.rt-hero--slider) .rt-lead { color: #4b5563 !important; }
.rt-hero .rt-eyebrow { color: var(--rt-green) !important; }
.rt-hero--slider .rt-hero__slide--type-1 .rt-h1,
.rt-hero--slider .rt-hero__slide--type-2 .rt-h1 { color: #0b1220 !important; }
.rt-hero--slider .rt-hero__slide--type-1 .rt-lead,
.rt-hero--slider .rt-hero__slide--type-2 .rt-lead { color: #4b5563 !important; }
.rt-fx-mesh svg {
  width: 100%;
  height: 100%;
  display: block;
}
.rt-hero > .rt-container:not(.rt-hero__chrome),
.rt-hero > .rt-container.rt-hero__viewport {
  position: relative;
  z-index: 1;
}
.rt-hero:not(.rt-hero--slider) {
  background:
    radial-gradient(ellipse 70% 55% at 85% 20%, rgba(0, 168, 79, 0.1), transparent 55%),
    radial-gradient(ellipse 50% 40% at 10% 80%, rgba(37, 99, 235, 0.06), transparent 50%),
    #f7f8fa;
}

.rt-fx-mesh .rt-link-line {
  stroke: rgba(0, 168, 79, 0.28);
  stroke-width: 1.25;
  fill: none;
}
.rt-fx-mesh .rt-link-glow {
  stroke: rgba(0, 168, 79, 0.55);
  stroke-width: 2;
  fill: none;
  stroke-dasharray: 6 140;
  animation: rt-packet-dash 4.5s linear infinite;
}
.rt-fx-mesh .rt-link-glow:nth-child(2) { animation-duration: 5.5s; animation-delay: -1.2s; }
.rt-fx-mesh .rt-link-glow:nth-child(3) { animation-duration: 3.8s; animation-delay: -2s; stroke: rgba(37, 99, 235, 0.45); }
.rt-fx-mesh .rt-node {
  fill: #fff;
  stroke: var(--rt-green);
  stroke-width: 2;
}
.rt-fx-mesh .rt-node--core {
  fill: var(--rt-green);
  stroke: #008f43;
}
.rt-fx-mesh .rt-pulse {
  fill: rgba(0, 168, 79, 0.25);
  transform-origin: center;
  animation: rt-node-pulse 2.8s ease-out infinite;
}
.rt-fx-mesh .rt-pulse--2 { animation-delay: 0.9s; fill: rgba(37, 99, 235, 0.2); }
.rt-fx-mesh .rt-pulse--3 { animation-delay: 1.6s; }

@keyframes rt-packet-dash {
  to { stroke-dashoffset: -146; }
}
@keyframes rt-node-pulse {
  0% { opacity: 0.7; transform: scale(0.55); }
  70% { opacity: 0; transform: scale(2.1); }
  100% { opacity: 0; transform: scale(2.2); }
}

/* Illustration stage */
.rt-illu {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 1.15 / 1;
  border-radius: 18px;
  overflow: hidden;
  background:
    radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.9), transparent 45%),
    linear-gradient(160deg, #f0fdf4 0%, #e8f0f8 48%, #eef2f7 100%);
  border: 1px solid rgba(15, 23, 42, 0.06);
  margin-bottom: 1rem;
}
.rt-illu svg {
  width: min(86%, 220px);
  height: auto;
  display: block;
  filter: drop-shadow(0 12px 24px rgba(15, 23, 42, 0.08));
}
.rt-illu--sm {
  aspect-ratio: 1;
  width: 64px;
  height: 64px;
  margin-bottom: 0.9rem;
  border-radius: 16px;
  flex-shrink: 0;
}
.rt-illu--sm svg { width: 70%; }
.rt-illu--lg {
  aspect-ratio: 4 / 3;
  min-height: 220px;
  margin: 0;
}
.rt-illu--float svg {
  animation: rt-float 5.5s ease-in-out infinite;
}
.rt-illu--dark {
  background:
    radial-gradient(circle at 70% 20%, rgba(0, 168, 79, 0.28), transparent 40%),
    linear-gradient(145deg, #0b1220, #102a1c 55%, #0f172a);
  border-color: rgba(255, 255, 255, 0.08);
}
.rt-illu--dark svg { filter: drop-shadow(0 16px 32px rgba(0, 0, 0, 0.35)); }

@keyframes rt-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

/* Fiber light sweep on paths */
.rt-illu .rt-fiber-core {
  stroke: #00a84f;
  stroke-width: 3.5;
  stroke-linecap: round;
  fill: none;
  filter: drop-shadow(0 0 6px rgba(0, 168, 79, 0.55));
}
.rt-illu .rt-fiber-pulse {
  stroke: #86efac;
  stroke-width: 4;
  stroke-linecap: round;
  fill: none;
  stroke-dasharray: 18 120;
  animation: rt-fiber-run 2.4s linear infinite;
}
.rt-illu .rt-fiber-pulse--slow { animation-duration: 3.6s; animation-delay: -1s; }

@keyframes rt-fiber-run {
  to { stroke-dashoffset: -138; }
}

/* Wireless signal rings */
.rt-illu .rt-ring {
  fill: none;
  stroke: rgba(37, 99, 235, 0.35);
  stroke-width: 2;
  transform-origin: center;
  animation: rt-ring-out 2.8s ease-out infinite;
}
.rt-illu .rt-ring--2 { animation-delay: 0.7s; stroke: rgba(0, 168, 79, 0.35); }
.rt-illu .rt-ring--3 { animation-delay: 1.4s; }

@keyframes rt-ring-out {
  0% { opacity: 0.7; transform: scale(0.55); }
  100% { opacity: 0; transform: scale(1.35); }
}

/* Cyber shield shimmer */
.rt-illu .rt-shield-glow {
  fill: rgba(0, 168, 79, 0.18);
  animation: rt-shield-breathe 3.2s ease-in-out infinite;
}
@keyframes rt-shield-breathe {
  0%, 100% { opacity: 0.45; }
  50% { opacity: 1; }
}

/* Data packets hopping between nodes */
.rt-illu .rt-hop {
  offset-path: path("M40,140 C90,40 170,40 220,140");
  animation: rt-hop 3.2s linear infinite;
}
.rt-illu .rt-hop--2 {
  offset-path: path("M60,160 C110,80 180,80 230,160");
  animation-delay: -1.4s;
  animation-duration: 4s;
}
@keyframes rt-hop {
  0% { offset-distance: 0%; opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { offset-distance: 100%; opacity: 0; }
}

/* Tech expertise band */
.rt-tech-band {
  position: relative;
  overflow: hidden;
  padding: 4.5rem 0;
  color: #fff;
  background:
    radial-gradient(ellipse 60% 80% at 0% 50%, rgba(0, 168, 79, 0.35), transparent 55%),
    radial-gradient(ellipse 50% 70% at 100% 30%, rgba(37, 99, 235, 0.22), transparent 50%),
    linear-gradient(135deg, #0b1220 0%, #0f291c 45%, #0b1220 100%);
}
.rt-tech-band .rt-fx-mesh { opacity: 0.35; }
.rt-tech-band .rt-container { position: relative; z-index: 1; }
.rt-tech-band .rt-eyebrow { color: #86efac; }
.rt-tech-band .rt-h2 { color: #fff; }
.rt-tech-band .rt-lead { color: rgba(255, 255, 255, 0.75); }
.rt-tech-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-top: 2rem;
}
.rt-tech-card {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  padding: 1.15rem;
  backdrop-filter: blur(10px);
  transition: transform 0.25s, background 0.25s, border-color 0.25s;
}
.rt-tech-card:hover {
  transform: translateY(-4px);
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(134, 239, 172, 0.35);
}
.rt-tech-card h3 {
  margin: 0.75rem 0 0.35rem;
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
}
.rt-tech-card p {
  margin: 0;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.88rem;
  line-height: 1.5;
}

/* Hero visual glow rings behind product photos */
/* Hero visual glow — disabled on slide 1 card */
.rt-hero__slide--type-1 .rt-hero__visual::after {
  display: none;
}
.rt-hero__visual {
  --rt-glow: rgba(0, 168, 79, 0.2);
}
.rt-hero__visual::after {
  content: "";
  position: absolute;
  width: min(78%, 360px);
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle, var(--rt-glow) 0%, transparent 68%);
  z-index: 0;
  animation: rt-glow-pulse 4s ease-in-out infinite;
}
.rt-hero__visual img { position: relative; z-index: 1; }
@keyframes rt-glow-pulse {
  0%, 100% { transform: scale(1); opacity: 0.85; }
  50% { transform: scale(1.08); opacity: 1; }
}

/* Product / tile media with illustration */
.rt-product .rt-illu,
.rt-tile .rt-illu { margin-bottom: 1rem; }
.rt-tile--illu {
  display: flex;
  flex-direction: column;
}
.rt-feature .rt-illu--sm { margin-bottom: 0.85rem; }

/* Page hero split with illustration */
.rt-hero--split .rt-container {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 2rem;
  align-items: center;
}
.rt-hero--split .rt-hero__copy { max-width: 36rem; }

/* Soft section with fiber ribbon */
.rt-fiber-ribbon {
  height: 3px;
  width: 100%;
  margin: 0 0 1.5rem;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, #00a84f 20%, #86efac 50%, #2563eb 80%, transparent);
  background-size: 200% 100%;
  animation: rt-ribbon 6s linear infinite;
}
@keyframes rt-ribbon {
  to { background-position: -200% 0; }
}

@media (max-width: 980px) {
  .rt-tech-grid { grid-template-columns: 1fr 1fr; }
  .rt-hero--split .rt-container { grid-template-columns: 1fr; }
  .rt-section .rt-container[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  .rt-tech-grid { grid-template-columns: 1fr; }
  .rt-fx-mesh { opacity: 0.35; }
  .rt-section .rt-container[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
  .rt-tile--illu {
    flex-direction: row;
    align-items: center;
    gap: 0.65rem;
    padding: 0.8rem 0.85rem;
  }
  .rt-tile--illu .rt-illu--sm {
    width: 44px;
    height: 44px;
    margin-bottom: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rt-fx-mesh .rt-link-glow,
  .rt-fx-mesh .rt-pulse,
  .rt-illu--float svg,
  .rt-illu .rt-fiber-pulse,
  .rt-illu .rt-ring,
  .rt-illu .rt-shield-glow,
  .rt-illu .rt-hop,
  .rt-hero__visual::after,
  .rt-fiber-ribbon {
    animation: none !important;
  }
  .rt-illu .rt-hop { opacity: 0; }
}
