/* ============================================================
   MIHARI · DYNAMIC MODULE BACKGROUNDS
   Visual pass based on the approved concept images.
   ============================================================ */

#modules.sc-modules {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 8%, rgba(0, 184, 255, .09), transparent 0 20%),
    radial-gradient(circle at 82% 12%, rgba(0, 111, 255, .07), transparent 0 20%),
    linear-gradient(180deg, #03101a 0%, #061722 23%, #03101a 48%, #020b13 70%, #06121b 100%);
}
#modules.sc-modules::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .34;
  background-image:
    radial-gradient(circle, rgba(97, 225, 255, .35) 0 1px, transparent 1.4px),
    linear-gradient(rgba(99, 223, 255, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(99, 223, 255, .018) 1px, transparent 1px);
  background-size: 84px 84px, 72px 72px, 72px 72px;
  background-position: 0 0, 0 0, 0 0;
  animation: mihariStarDrift 28s linear infinite;
  mask-image: linear-gradient(transparent, #000 5%, #000 95%, transparent);
}
@keyframes mihariStarDrift {
  from { background-position: 0 0, 0 0, 0 0; }
  to { background-position: -90px 22px, -72px 0, -72px 0; }
}

/* intro */
#modules .sc-heading {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 560px) minmax(420px, 1fr) !important;
  gap: clamp(54px, 6vw, 100px) !important;
  align-items: center;
  max-width: 1480px !important;
  margin: 0 auto 70px !important;
  min-height: 0 !important;
  padding: 0;
}
#modules .sc-heading::before,
#modules .sc-heading::after {
  display: none !important;
}
#modules .sc-heading-copy {
  position: relative;
  z-index: 2;
}
#modules .sc-heading-copy h2 {
  margin: 0 0 26px;
  font-size: clamp(62px, 6.6vw, 94px) !important;
  line-height: .96;
  letter-spacing: -.065em !important;
  max-width: 9.5ch;
}
#modules .sc-heading-copy h2 span { color: #18d8ff; }
#modules .sc-heading-copy p {
  max-width: 42ch;
  color: #afc4d1;
  line-height: 1.78;
  font-size: 18px;
}
.sc-heading-signal {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 30px;
  padding-top: 20px;
  border-top: 1px solid rgba(91, 213, 245, .16);
  color: #7ea7ba;
}
.sc-heading-signal small {
  letter-spacing: 1.9px;
  font-size: 10px;
}
.sc-heading-eq {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 36px;
}
.sc-heading-eq i {
  width: 3px;
  height: 18px;
  border-radius: 99px;
  background: linear-gradient(180deg,#71f2ff,#0ec6f7);
  box-shadow: 0 0 10px rgba(31, 218, 255, .34);
  animation: scEq 1.6s ease-in-out infinite;
}
.sc-heading-eq i:nth-child(2){animation-delay:.12s;height:28px}
.sc-heading-eq i:nth-child(3){animation-delay:.24s;height:34px}
.sc-heading-eq i:nth-child(4){animation-delay:.36s;height:24px}
.sc-heading-eq i:nth-child(5){animation-delay:.48s;height:16px}
@keyframes scEq { 0%,100%{transform:scaleY(.55);opacity:.55} 50%{transform:scaleY(1);opacity:1} }

.sc-context-visual {
  position: relative;
  min-height: 500px;
  border-radius: 34px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 50%, rgba(0, 210, 255, .15), transparent 0 26%),
    radial-gradient(circle at 20% 22%, rgba(0, 132, 255, .12), transparent 0 18%),
    radial-gradient(circle at 82% 74%, rgba(0, 197, 255, .10), transparent 0 18%),
    linear-gradient(145deg, rgba(6, 24, 35, .90), rgba(3, 12, 20, .72));
  border: 1px solid rgba(74, 206, 238, .18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 36px 90px rgba(0,0,0,.24);
  isolation: isolate;
}
.sc-context-visual::before {
  content: "";
  position: absolute;
  inset: auto -12% -22% -12%;
  height: 58%;
  background:
    radial-gradient(110% 88% at 50% 108%, transparent 0 49%, rgba(49, 215, 255, .22) 50% 51%, transparent 52% 58%, rgba(49, 215, 255, .14) 59% 60%, transparent 61% 68%, rgba(49, 215, 255, .10) 69% 70%, transparent 71% 100%),
    radial-gradient(120% 90% at 50% 116%, transparent 0 56%, rgba(0, 125, 255, .16) 57% 58%, transparent 59% 65%, rgba(0, 125, 255, .10) 66% 67%, transparent 68% 100%);
  animation: scContextWaves 11s ease-in-out infinite alternate;
  filter: drop-shadow(0 0 14px rgba(0, 196, 255, .12));
  z-index: -1;
}
.sc-context-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle, rgba(96,235,255,.38) 0 1px, transparent 1.4px);
  background-size: 54px 54px;
  opacity: .16;
  animation: scContextDots 22s linear infinite;
  z-index: -2;
}
@keyframes scContextWaves {
  from { transform: translateX(-3%) translateY(2px) scaleX(.98); }
  to { transform: translateX(3%) translateY(-7px) scaleX(1.03); }
}
@keyframes scContextDots { to { background-position: -54px 24px; } }
.sc-context-orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  transform: translate(-50%,-50%);
  border: 1px dashed rgba(76, 227, 255, .24);
  pointer-events: none;
}
.sc-context-orbit.orbit-a { width: 72%; aspect-ratio: 1.45; animation: scOrbit 24s linear infinite; }
.sc-context-orbit.orbit-b { width: 48%; aspect-ratio: 1.6; animation: scOrbit 18s linear infinite reverse; }
@keyframes scOrbit { from{transform:translate(-50%,-50%) rotate(0)} to{transform:translate(-50%,-50%) rotate(360deg)} }
.sc-context-core,
.sc-context-node {
  position: absolute;
  border: 1px solid rgba(78, 224, 255, .30);
  background: linear-gradient(155deg, rgba(10, 34, 48, .92), rgba(4, 14, 22, .90));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 42px rgba(0,0,0,.24), 0 0 24px rgba(0,209,255,.06);
  backdrop-filter: blur(10px);
}
.sc-context-core {
  left: 50%;
  top: 50%;
  width: 190px;
  min-height: 132px;
  transform: translate(-50%,-50%);
  border-radius: 26px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 0 48px rgba(0,212,255,.18);
}
.sc-context-core::before {
  content:"";
  width: 54px;
  height: 54px;
  border-radius: 50%;
  margin-bottom: 10px;
  background:
    radial-gradient(circle,#a8f8ff 0 5px,#27ddff 6px 9px,transparent 10px),
    conic-gradient(from 45deg,transparent 0 12%,#23d8ff 13% 18%,transparent 19% 37%,#23d8ff 38% 43%,transparent 44% 62%,#23d8ff 63% 68%,transparent 69% 87%,#23d8ff 88% 93%,transparent 94% 100%);
  border: 1px solid rgba(85,229,255,.4);
  box-shadow: 0 0 24px rgba(0,219,255,.25);
}
.sc-context-core b,
.sc-context-node b { font-size: 18px; }
.sc-context-core b span,
.sc-context-node b span { color:#21d9ff; }
.sc-context-core small,
.sc-context-node small { display:block;color:#82a9ba;font-size:9px;letter-spacing:1.9px;margin-top:5px }
.sc-context-node {
  width: 156px;
  min-height: 92px;
  border-radius: 18px;
  padding: 18px 18px 16px;
  animation: scNodeFloat 6s ease-in-out infinite;
}
.sc-node-map { left: 7%; top: 14%; }
.sc-node-iam { right: 7%; top: 16%; animation-delay:.9s }
.sc-node-threats { left: 9%; bottom: 13%; animation-delay:1.8s }
.sc-node-comply { right: 8%; bottom: 14%; animation-delay:2.7s }
@keyframes scNodeFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-9px)} }

/* per-module visual spacing + section tone */
#modules .sm-story-row {
  position: relative !important;
  max-width: 1500px !important;
  column-gap: clamp(56px, 6vw, 110px) !important;
  margin-bottom: 180px !important;
  padding: 48px 34px 58px !important;
  border-radius: 36px;
  overflow: hidden;
  isolation: isolate;
}
#modules .sm-story-row > *:not(.mihari-wave-field) { position: relative; z-index: 2; }
#modules .sm-story-row::before {
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  z-index:-2;
  pointer-events:none;
  border:1px solid rgba(92, 203, 238, .10);
  background:linear-gradient(145deg, rgba(8, 26, 38, .76), rgba(2, 10, 17, .48));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
#modules #shadowmap::before {
  background:
    radial-gradient(circle at 18% 24%, rgba(0, 195, 255, .10), transparent 0 24%),
    radial-gradient(circle at 78% 66%, rgba(0, 119, 255, .07), transparent 0 26%),
    linear-gradient(145deg, rgba(7, 26, 39, .80), rgba(3, 12, 19, .50));
}
#modules #shadowiam::before {
  background:
    radial-gradient(circle at 76% 38%, rgba(0, 190, 255, .08), transparent 0 24%),
    radial-gradient(circle at 22% 72%, rgba(0, 85, 145, .05), transparent 0 24%),
    linear-gradient(145deg, rgba(3, 13, 21, .92), rgba(2, 8, 14, .78));
}
#modules #shadowthreats::before {
  background:
    radial-gradient(circle at 20% 18%, rgba(0, 188, 255, .08), transparent 0 22%),
    radial-gradient(circle at 82% 68%, rgba(255, 66, 108, .08), transparent 0 22%),
    linear-gradient(145deg, rgba(5, 17, 26, .90), rgba(3, 10, 17, .74));
}
#modules #shadowcomply::before {
  background:
    radial-gradient(circle at 76% 26%, rgba(0, 202, 255, .09), transparent 0 20%),
    radial-gradient(circle at 22% 76%, rgba(255, 189, 54, .045), transparent 0 22%),
    linear-gradient(145deg, rgba(4, 16, 24, .88), rgba(2, 10, 16, .68));
}
#modules .mm-copy {
  position: relative;
  padding: 34px 38px 38px !important;
  border-radius: 26px;
  background: linear-gradient(145deg, rgba(6, 22, 33, .70), rgba(3, 13, 20, .42));
  border: 1px solid rgba(79, 194, 229, .13);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.024), 0 22px 54px rgba(0,0,0,.10);
  backdrop-filter: blur(8px);
}
#modules #shadowiam .mm-copy { background:linear-gradient(145deg,rgba(3,14,22,.84),rgba(2,9,15,.66)); }
#modules #shadowcomply .mm-copy { background:linear-gradient(145deg,rgba(5,18,27,.76),rgba(3,12,19,.52)); }
#modules .mm-copy p { color:#a9c1ce; line-height:1.62; margin:0 0 22px; }
#modules .mm-copy p strong { color:#e2f5fc; font-weight:600; }
#modules .mm-copy .sm-lead { color:#edf7fb; font-size:clamp(25px,2.35vw,34px); line-height:1.38; }
#modules .mm-copy .cin-text-link { margin-top: 18px; }
.mihari-signal-rail {
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid rgba(84, 211, 244, .14);
  display: flex;
  align-items: center;
  gap: 18px;
  color:#7fa4b6;
}
.mihari-signal-bars { display:inline-flex;align-items:center;gap:3px;height:28px; }
.mihari-signal-bars i { width:2px;height:12px;border-radius:999px;background:#18d8ff;box-shadow:0 0 8px rgba(24,216,255,.25);animation:mhRail 1.7s ease-in-out infinite; }
.mihari-signal-bars i:nth-child(2){height:23px;animation-delay:.12s}.mihari-signal-bars i:nth-child(3){height:28px;animation-delay:.24s}.mihari-signal-bars i:nth-child(4){height:19px;animation-delay:.36s}.mihari-signal-bars i:nth-child(5){height:11px;animation-delay:.48s}
.mihari-signal-rail small{font-size:9px;letter-spacing:1.7px}
@keyframes mhRail{0%,100%{transform:scaleY(.55);opacity:.45}50%{transform:scaleY(1);opacity:1}}

/* large animated wave field inserted by JS */
.mihari-wave-field {
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  overflow:hidden;
  opacity:0;
  transition:opacity 1.1s ease .18s;
}
.mihari-wave-field.mw-in { opacity:.92; }
.mihari-wave-field svg { width:100%;height:100%;display:block;overflow:visible; }
.mihari-wave-field .mw-grid { opacity:.18; }
.mihari-wave-field .mw-line {
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:2 16;
  animation: mwDash 16s linear infinite;
}
.mihari-wave-field .mw-line.wave-1 { stroke:rgba(47,220,255,.34);stroke-width:2.2; }
.mihari-wave-field .mw-line.wave-2 { stroke:rgba(0,153,255,.24);stroke-width:1.4;animation-duration:16s; }
.mihari-wave-field .mw-line.wave-3 { stroke:rgba(98,235,255,.16);stroke-width:1.1;animation-duration:20s; }
.mihari-wave-field .mw-flow {
  fill:none;
  stroke-width:3.3;
  opacity:.32;
  stroke-dasharray:42 120;
  animation:mwFlow 7.5s linear infinite;
}
.mihari-wave-field .mw-node { fill:#76f2ff; }
@keyframes mwDash { to { stroke-dashoffset:-216; } }
@keyframes mwFlow { from{stroke-dashoffset:0} to{stroke-dashoffset:-320} }

/* make every route/connector feel like data transmission;
   en las escenas de los módulos solo cuando el JS ya enrutó la línea (.is-live),
   para que el trazo punteado nunca aparezca antes que su bloque */
#modules .sm-story-wires path,
#modules .sx-story-wires path,
#modules .sm-story-wires line,
#modules .sx-story-wires line,
#providers .cin-wire {
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
#modules .sm-story-wires path.is-live,
#modules .sx-story-wires path.is-live,
#modules .sm-story-wires line.is-live,
#modules .sx-story-wires line.is-live {
  stroke-dasharray:4 15 !important;
  animation:routePulse 4.8s linear infinite !important;
  filter:drop-shadow(0 0 6px rgba(70,224,255,.22));
}
@keyframes routePulse { to{stroke-dashoffset:-120} }
#modules .sm-story-wires circle,
#modules .sx-story-wires circle,
#providers .cin-packet { filter:drop-shadow(0 0 8px currentColor); }

/* Protection Hybrid receives the same living wave system */
#providers.cin-hybrid {
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 24%, rgba(0, 213, 255, .11), transparent 0 20%),
    radial-gradient(circle at 84% 46%, rgba(0, 108, 255, .08), transparent 0 24%),
    linear-gradient(180deg,#03101a 0%,#06141e 52%,#020a12 100%);
}
#providers.cin-hybrid::before {
  content:"";
  position:absolute;
  inset:auto -12% -16% -12%;
  height:56%;
  background:
    radial-gradient(110% 85% at 50% 108%,transparent 0 48%,rgba(42,217,255,.18) 49% 50%,transparent 51% 58%,rgba(42,217,255,.11) 59% 60%,transparent 61% 68%,rgba(42,217,255,.08) 69% 70%,transparent 71% 100%),
    radial-gradient(125% 95% at 50% 116%,transparent 0 56%,rgba(0,126,255,.13) 57% 58%,transparent 59% 67%,rgba(0,126,255,.08) 68% 69%,transparent 70% 100%);
  animation:hybridWave 13s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes hybridWave{from{transform:translateX(-3%) translateY(3px)}to{transform:translateX(3%) translateY(-8px)}}
#providers .cin-hybrid-stage,
#providers .cin-section-head,
#providers .cin-cloud-notice,
#providers .cin-hybrid-stats { position:relative;z-index:2; }
#providers .cin-env {
  background:linear-gradient(145deg,rgba(10,31,44,.80),rgba(3,14,22,.70));
  border:1px solid rgba(79,206,240,.14);
  border-radius:20px;
  box-shadow:0 18px 48px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.028);
}
#providers .cin-env:hover { border-color:rgba(72,222,255,.30);box-shadow:0 24px 58px rgba(0,0,0,.24),0 0 28px rgba(0,209,255,.08); }

@media(max-width:1080px){
  #modules .sc-heading{grid-template-columns:1fr !important;min-height:0 !important;}
  .sc-context-visual{min-height:430px;max-width:760px;width:100%;}
  #modules .sm-story-row{column-gap:70px !important;padding-inline:24px !important;}
}
@media(max-width:760px){
  #modules .sc-heading-copy h2{font-size:clamp(52px,15vw,78px) !important;}
  .sc-context-visual{min-height:390px;}
  .sc-context-node{width:126px;padding:14px;}
  .sc-context-core{width:150px;min-height:112px;}
  #modules .sm-story-row{padding:28px 16px 36px !important;margin-bottom:110px !important;}
  #modules .mm-copy{padding:26px 24px 28px !important;}
}

/* modern curved infrastructure data routes */
#providers .cin-hybrid-wires .cin-wire {
  stroke: rgba(21, 113, 145, .78);
  stroke-width: 2.1;
}
#providers .cin-hybrid-wires .cin-wire-glow {
  stroke: url(#cinDataLine);
  stroke-width: 1.45;
  opacity: .96;
  filter: drop-shadow(0 0 9px rgba(0, 209, 255, .28));
}
#providers .cin-hybrid-wires .cin-wire-stream {
  fill: none;
  stroke: rgba(119, 240, 255, .92);
  stroke-width: 3.2;
  stroke-linecap: round;
  stroke-dasharray: 2 16;
  opacity: .55;
  animation: hybridDataStream 1.65s linear infinite;
  filter: drop-shadow(0 0 7px rgba(0, 213, 255, .26));
}
#providers .cin-wire-node {
  fill:#77ecff;
  stroke:#082331;
  stroke-width:1.2;
  filter:drop-shadow(0 0 9px rgba(0,213,255,.34));
}
#providers .cin-wire-node.is-core { fill:#b9fbff; }
#providers .cin-pulse {
  fill:none;
  stroke:#7fe7ff;
  stroke-width:1.3;
  transform-box: fill-box;
  transform-origin:center;
  animation: hybridPulseRing 1.15s ease-out infinite;
  filter:drop-shadow(0 0 8px rgba(0,213,255,.34));
}
#providers .cin-pulse.risk { stroke:#ff708d;filter:drop-shadow(0 0 8px rgba(255,112,141,.32)); }
@keyframes hybridDataStream { to { stroke-dashoffset:-72; } }
@keyframes hybridPulseRing { 0%{r:3;opacity:.9} 72%{r:14;opacity:.12} 100%{r:17;opacity:0} }

/* ============================================================
   FULL-BLEED LIVING FLOW PASS
   Lines and waves escape cards and travel across the page.
   ============================================================ */

/* Intro: centered typography, no secondary diagram */
#modules .sc-heading {
  display: block !important;
  min-height: 0 !important;
  max-width: 100% !important;
  margin: 0 auto 70px !important;
  padding: 24px 24px 56px !important;
  text-align: center;
  overflow: visible;
  isolation: isolate;
}
#modules .sc-heading-copy {
  width: min(100%, 980px);
  margin-inline: auto;
  position: relative;
  z-index: 3;
}
#modules .sc-heading-copy h2 {
  max-width: none !important;
  margin: 0 auto 28px !important;
  font-size: clamp(62px, 7vw, 104px) !important;
  line-height: .98 !important;
  letter-spacing: -.065em !important;
}
#modules .sc-heading-copy h2 strong {
  display: inline;
  color: #eef7fb;
  font-weight: 500;
  white-space: nowrap;
}
#modules .sc-heading-copy h2 span {
  display: inline-block;
  margin-top: 10px;
  color: #19d8ff;
}
#modules .sc-heading-copy p {
  margin: 0 auto;
  max-width: 48ch;
  font-size: 18px;
  line-height: 1.8;
  color: #a8bfcc;
}
#modules .sc-heading-signal {
  width: min(100%, 620px);
  justify-content: center;
  margin: 34px auto 0;
}
#modules .sc-heading::before {
  content: "" !important;
  display: block !important;
  position: absolute;
  left: 50%;
  bottom: 22px;
  width: 100vw;
  height: 46%;
  transform: translateX(-50%);
  background:
    radial-gradient(110% 90% at 50% 118%, transparent 0 48%, rgba(24, 206, 255, .20) 49% 50%, transparent 51% 57%, rgba(24, 206, 255, .13) 58% 59%, transparent 60% 67%, rgba(0, 119, 255, .10) 68% 69%, transparent 70% 100%),
    radial-gradient(125% 96% at 50% 124%, transparent 0 55%, rgba(0, 151, 255, .14) 56% 57%, transparent 58% 66%, rgba(0, 151, 255, .08) 67% 68%, transparent 69% 100%);
  opacity: .78;
  filter: drop-shadow(0 0 20px rgba(0, 185, 255, .12));
  animation: scIntroWaveSweep 13s ease-in-out infinite alternate;
  pointer-events: none;
  z-index: 0;
}
#modules .sc-heading::after {
  content: "" !important;
  display: block !important;
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 100vw;
  height: 55%;
  transform: translateX(-50%);
  background:
    radial-gradient(circle, rgba(93, 232, 255, .45) 0 1px, transparent 1.5px);
  background-size: 78px 78px;
  opacity: .13;
  animation: scIntroDots 22s linear infinite;
  pointer-events: none;
  z-index: -1;
}
@keyframes scIntroWaveSweep {
  from { transform: translateX(-52%) translateY(7px) scaleX(.98); }
  to { transform: translateX(-48%) translateY(-10px) scaleX(1.04); }
}
@keyframes scIntroDots { to { background-position: -78px 28px; } }

/* Full-width module bands; cards float on top */
#modules .sm-story-row {
  overflow: visible !important;
  isolation: isolate;
  padding: 64px 36px 72px !important;
  margin-bottom: 190px !important;
  border-radius: 0 !important;
}
#modules .sm-story-row::before {
  left: 50% !important;
  right: auto !important;
  top: -34px !important;
  bottom: -34px !important;
  width: 100vw !important;
  transform: translateX(-50%);
  border-radius: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}
#modules .sm-story-row::after {
  content: "";
  position: absolute;
  left: 50%;
  top: -34px;
  bottom: -34px;
  width: 100vw;
  transform: translateX(-50%);
  pointer-events: none;
  z-index: -3;
  opacity: .52;
  background:
    linear-gradient(90deg, transparent 0 8%, rgba(59, 198, 236, .025) 18%, transparent 34%, transparent 66%, rgba(59, 198, 236, .025) 82%, transparent 94%),
    repeating-linear-gradient(90deg, transparent 0 118px, rgba(84, 210, 242, .018) 119px, transparent 120px);
}
/* Darker / lighter zones tuned per artwork */
#modules #shadowmap::before {
  background:
    radial-gradient(circle at 24% 42%, rgba(0, 178, 226, .09), transparent 0 24%),
    radial-gradient(circle at 72% 50%, rgba(0, 98, 168, .05), transparent 0 28%),
    linear-gradient(180deg, #020b12 0%, #03101a 42%, #020a10 100%) !important;
}
#modules #shadowiam::before {
  background:
    radial-gradient(circle at 70% 42%, rgba(0, 166, 219, .065), transparent 0 22%),
    radial-gradient(circle at 20% 74%, rgba(0, 69, 108, .035), transparent 0 22%),
    linear-gradient(180deg, #01070c 0%, #020a10 48%, #01060b 100%) !important;
}
#modules #shadowthreats::before {
  background:
    radial-gradient(circle at 22% 28%, rgba(0, 159, 211, .065), transparent 0 20%),
    radial-gradient(circle at 80% 66%, rgba(150, 27, 57, .075), transparent 0 20%),
    linear-gradient(180deg, #02080e 0%, #030b12 46%, #01070b 100%) !important;
}
#modules #shadowcomply::before {
  background:
    radial-gradient(circle at 76% 34%, rgba(0, 169, 213, .06), transparent 0 20%),
    radial-gradient(circle at 24% 72%, rgba(125, 94, 21, .032), transparent 0 22%),
    linear-gradient(180deg, #02090f 0%, #041019 46%, #02090e 100%) !important;
}

/* Full-bleed wave field */
#modules .sm-story-row > .mihari-wave-field,
#modules .sc-heading > .mihari-wave-field,
#providers.cin-hybrid > .mihari-wave-field,
#blog.cin-blog > .mihari-wave-field {
  left: 50% !important;
  right: auto !important;
  top: -70px !important;
  bottom: -70px !important;
  width: 100vw !important;
  height: auto !important;
  transform: translate3d(-50%, var(--mw-shift, 0px), 0);
  overflow: visible !important;
  opacity: .98;
  z-index: 0;
}
#modules .sm-story-row > *:not(.mihari-wave-field),
#modules .sc-heading > *:not(.mihari-wave-field),
#providers.cin-hybrid > *:not(.mihari-wave-field),
#blog.cin-blog > *:not(.mihari-wave-field):not(.mihari-mesh-wave) {
  position: relative;
  z-index: 2;
}
.mihari-wave-field .mw-line.wave-1 {
  stroke: rgba(42, 220, 255, .42) !important;
  stroke-width: 2.35 !important;
}
.mihari-wave-field .mw-line.wave-2 {
  stroke: rgba(0, 139, 255, .30) !important;
  stroke-width: 1.55 !important;
}
.mihari-wave-field .mw-line.wave-3 {
  stroke: rgba(121, 241, 255, .19) !important;
  stroke-width: 1.2 !important;
}
.mihari-wave-field .mw-flow {
  stroke-width: 4.1 !important;
  opacity: .46 !important;
  stroke-dasharray: 54 132 !important;
  animation-duration: 6.2s !important;
}
.mihari-wave-field .mw-node {
  fill: #b1fbff !important;
  stroke: rgba(20, 193, 232, .85);
  stroke-width: 1.2;
}

/* Stronger and clearer copy cards */
#modules .mm-copy {
  padding: 38px 42px 42px !important;
  border-radius: 26px !important;
  border: 1px solid rgba(67, 190, 224, .24) !important;
  background:
    linear-gradient(145deg, rgba(5, 18, 28, .93), rgba(2, 10, 16, .84)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 24px 62px rgba(0, 0, 0, .24),
    0 0 0 1px rgba(0, 183, 230, .018) !important;
  backdrop-filter: blur(14px) !important;
}
#modules #shadowiam .mm-copy {
  background: linear-gradient(145deg, rgba(2, 10, 16, .97), rgba(1, 7, 12, .91)) !important;
  border-color: rgba(55, 158, 190, .20) !important;
}
#modules #shadowthreats .mm-copy {
  background: linear-gradient(145deg, rgba(4, 13, 21, .96), rgba(2, 8, 14, .90)) !important;
}
#modules #shadowcomply .mm-copy {
  background: linear-gradient(145deg, rgba(4, 15, 23, .95), rgba(2, 9, 14, .88)) !important;
}
#modules .mm-copy::before {
  content: "";
  position: absolute;
  inset: 12px;
  border-radius: 18px;
  border: 1px solid rgba(117, 227, 255, .055);
  pointer-events: none;
}
#modules .mm-copy::after {
  content: "";
  position: absolute;
  right: -18px;
  top: 22%;
  width: 36px;
  height: 56%;
  border-right: 1px solid rgba(53, 217, 255, .22);
  border-top: 1px solid rgba(53, 217, 255, .11);
  border-bottom: 1px solid rgba(53, 217, 255, .11);
  border-radius: 0 16px 16px 0;
  opacity: .85;
  pointer-events: none;
}

/* Side telemetry decoration */
.mihari-copy-telemetry {
  position: absolute;
  top: 50%;
  width: 76px;
  height: 220px;
  transform: translateY(-50%);
  pointer-events: none;
  color: #6da5b8;
  opacity: .88;
}
.sx-reverse .mm-copy .mihari-copy-telemetry,
#shadowmap .mm-copy .mihari-copy-telemetry,
#shadowthreats .mm-copy .mihari-copy-telemetry {
  right: -98px;
}
.sx-story-row:not(.sx-reverse) .mm-copy .mihari-copy-telemetry,
#shadowcomply .mm-copy .mihari-copy-telemetry {
  left: -98px;
}
.mihari-copy-telemetry::before {
  content: "";
  position: absolute;
  left: 38px;
  top: 18px;
  bottom: 18px;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(44, 216, 255, .56), rgba(44, 216, 255, .18), transparent);
}
.mihari-copy-telemetry i {
  position: absolute;
  left: 33px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #03121b;
  border: 1px solid #3ee7ff;
  box-shadow: 0 0 14px rgba(62, 231, 255, .35);
  animation: mhTelemetryPulse 2.8s ease-in-out infinite;
}
.mihari-copy-telemetry i:nth-child(1) { top: 30px; }
.mihari-copy-telemetry i:nth-child(2) { top: 104px; animation-delay: .7s; }
.mihari-copy-telemetry i:nth-child(3) { bottom: 30px; animation-delay: 1.4s; }
.mihari-copy-telemetry small {
  position: absolute;
  top: 50%;
  left: 52px;
  transform: translateY(-50%) rotate(90deg);
  transform-origin: left center;
  white-space: nowrap;
  font-size: 8px;
  letter-spacing: 2.1px;
  color: #5f8fa2;
}
@keyframes mhTelemetryPulse {
  0%,100% { transform: scale(.82); opacity: .48; }
  50% { transform: scale(1.16); opacity: 1; }
}

/* Visualization cards blend into their dark bands instead of looking pasted in */
#modules .sm-story {
  border-color: rgba(60, 177, 211, .18) !important;
  background:
    radial-gradient(circle at 50% 36%, rgba(0, 155, 205, .045), transparent 0 28%),
    linear-gradient(180deg, rgba(1, 7, 12, .97), rgba(3, 12, 18, .90)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 26px 68px rgba(0,0,0,.30) !important;
}
#modules #shadowiam .sm-story {
  background:
    radial-gradient(circle at 50% 38%, rgba(0, 188, 238, .06), transparent 0 25%),
    linear-gradient(180deg, rgba(0, 5, 9, .995), rgba(2, 9, 14, .96)) !important;
}
#modules #shadowthreats .sm-story {
  background:
    radial-gradient(circle at 80% 70%, rgba(145, 23, 49, .055), transparent 0 22%),
    linear-gradient(180deg, rgba(1, 6, 10, .99), rgba(3, 9, 14, .95)) !important;
}
#modules #shadowcomply .sm-story {
  background:
    radial-gradient(circle at 52% 36%, rgba(0, 146, 190, .045), transparent 0 24%),
    linear-gradient(180deg, rgba(1, 7, 11, .99), rgba(3, 11, 16, .94)) !important;
}

/* Hybrid section: gradient banding + full-page flow */
#providers.cin-hybrid {
  overflow: visible !important;
  isolation: isolate;
  background:
    radial-gradient(circle at 50% 18%, rgba(0, 203, 255, .15), transparent 0 19%),
    radial-gradient(circle at 12% 54%, rgba(0, 116, 255, .07), transparent 0 28%),
    radial-gradient(circle at 88% 58%, rgba(0, 154, 226, .08), transparent 0 26%),
    linear-gradient(180deg, #020a11 0%, #04131d 46%, #02080e 100%) !important;
}
#providers.cin-hybrid::before {
  left: 50% !important;
  right: auto !important;
  bottom: -80px !important;
  width: 100vw !important;
  height: 66% !important;
  transform: translateX(-50%);
  background:
    radial-gradient(115% 86% at 50% 108%, transparent 0 48%, rgba(38, 219, 255, .22) 49% 50%, transparent 51% 57%, rgba(38, 219, 255, .13) 58% 59%, transparent 60% 66%, rgba(0, 126, 255, .10) 67% 68%, transparent 69% 100%),
    radial-gradient(135% 96% at 50% 118%, transparent 0 56%, rgba(0, 137, 255, .13) 57% 58%, transparent 59% 67%, rgba(0, 137, 255, .07) 68% 69%, transparent 70% 100%) !important;
  animation: hybridWaveWide 14s ease-in-out infinite alternate !important;
}
@keyframes hybridWaveWide {
  from { transform: translateX(-53%) translateY(6px) scaleX(.98); }
  to { transform: translateX(-47%) translateY(-12px) scaleX(1.04); }
}
#providers .cin-env {
  background:
    radial-gradient(circle at 50% 8%, rgba(0, 187, 230, .075), transparent 0 24%),
    linear-gradient(145deg, rgba(4, 18, 27, .94), rgba(2, 10, 16, .86)) !important;
  border-color: rgba(65, 202, 235, .24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 22px 58px rgba(0,0,0,.24) !important;
}
#providers .cin-cloud-notice,
#providers .cin-hybrid-stats {
  background: linear-gradient(145deg, rgba(3, 17, 25, .93), rgba(2, 10, 16, .88)) !important;
  border-color: rgba(62, 199, 231, .22) !important;
  box-shadow: 0 22px 60px rgba(0,0,0,.20) !important;
}
/* Hybrid routes feel like illuminated fibre rather than plain SVG */
#providers .cin-hybrid-wires .cin-wire {
  stroke: rgba(15, 93, 120, .72) !important;
  stroke-width: 5.2 !important;
  opacity: .34;
}
#providers .cin-hybrid-wires .cin-wire-glow {
  stroke-width: 2.4 !important;
  opacity: .98 !important;
  filter: drop-shadow(0 0 12px rgba(0, 216, 255, .42)) !important;
}
#providers .cin-hybrid-wires .cin-wire-stream {
  stroke-width: 4.1 !important;
  stroke-dasharray: 3 19 !important;
  opacity: .82 !important;
  animation-duration: 1.35s !important;
  filter: drop-shadow(0 0 10px rgba(0, 220, 255, .42)) !important;
}
#providers .cin-hybrid-wires .cin-wire-ambient {
  fill: none;
  stroke: rgba(154, 247, 255, .78);
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-dasharray: 28 110;
  opacity: .44;
  animation: hybridAmbientFlow 3.8s linear infinite;
  filter: drop-shadow(0 0 8px rgba(0, 217, 255, .32));
}
@keyframes hybridAmbientFlow { to { stroke-dashoffset: -260; } }

/* Responsive */
@media (max-width: 1100px) {
  #modules .sc-heading { min-height: 520px !important; padding-top: 88px !important; }
  #modules .sm-story-row { padding-inline: 24px !important; }
  .mihari-copy-telemetry { display: none; }
}
@media (max-width: 760px) {
  #modules .sc-heading {
    min-height: 460px !important;
    padding: 72px 16px 120px !important;
  }
  #modules .sc-heading-copy h2 {
    font-size: clamp(48px, 13vw, 72px) !important;
  }
  #modules .sc-heading-copy h2 strong { white-space: normal; }
  #modules .sm-story-row {
    padding: 40px 16px 48px !important;
    margin-bottom: 120px !important;
  }
  #modules .mm-copy {
    padding: 28px 24px 30px !important;
  }
}

/* Section-specific flow color accents */
#shadowiam > .mihari-wave-field .mw-line.wave-1 { stroke: rgba(37, 197, 238, .30) !important; }
#shadowiam > .mihari-wave-field .mw-flow { opacity: .34 !important; }
#shadowthreats > .mihari-wave-field .mw-line.wave-2 { stroke: rgba(255, 83, 116, .16) !important; }
#shadowthreats > .mihari-wave-field .mw-flow { opacity: .40 !important; }
#shadowcomply > .mihari-wave-field .mw-line.wave-3 { stroke: rgba(255, 194, 71, .10) !important; }
#shadowcomply > .mihari-wave-field .mw-flow { opacity: .38 !important; }

#providers .cin-route-spark {
  filter: drop-shadow(0 0 7px rgba(128, 243, 255, .8));
  pointer-events: none;
}


/* ============================================================
   FINAL MESH-WAVE PASS
   Replace heavy arcs with a thin living point surface.
   ============================================================ */
.mihari-mesh-wave {
  position: absolute;
  left: 50%;
  top: -80px;
  bottom: -80px;
  width: 100vw;
  height: calc(100% + 160px);
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 0;
  opacity: .78;
  mix-blend-mode: screen;
}
#modules .sm-story-row > .mihari-mesh-wave,
#modules .sc-heading > .mihari-mesh-wave,
#providers.cin-hybrid > .mihari-mesh-wave,
#blog.cin-blog > .mihari-mesh-wave {
  position: absolute;
}
#modules .sm-story-row > *:not(.mihari-wave-field):not(.mihari-mesh-wave),
#modules .sc-heading > *:not(.mihari-wave-field):not(.mihari-mesh-wave),
#providers.cin-hybrid > *:not(.mihari-wave-field):not(.mihari-mesh-wave),
#blog.cin-blog > *:not(.mihari-wave-field):not(.mihari-mesh-wave) {
  position: relative;
  z-index: 2;
}

/* The legacy SVG stays as a faint fibre guide, never as a thick arc. */
.mihari-wave-field {
  opacity: .34 !important;
}
.mihari-wave-field .mw-line.wave-1,
.mihari-wave-field .mw-line.wave-2,
.mihari-wave-field .mw-line.wave-3 {
  stroke-width: .72 !important;
  stroke-dasharray: 1 13 !important;
  opacity: .72;
}
.mihari-wave-field .mw-flow {
  stroke-width: 1.15 !important;
  opacity: .18 !important;
  stroke-dasharray: 18 150 !important;
  filter: drop-shadow(0 0 4px rgba(54, 219, 255, .18)) !important;
}
.mihari-wave-field .mw-node {
  r: 2px;
  opacity: .62;
}

/* Remove the old thick local waves inside cards. The mesh now continues through them. */
#modules .sm-story::after,
#modules .sm-landscape::after,
#providers.cin-hybrid::before,
#modules .sc-heading::before {
  display: none !important;
}

/* Cards remain readable while allowing the full-width mesh to be perceived behind them.
   Todas las tarjetas demo comparten el marco visible de ShadowMap: mismo fondo,
   borde sutil y sombra; cada módulo conserva solo su acento radial. */
#modules .sm-story {
  overflow: visible !important;
  background:
    radial-gradient(circle at 50% 36%, rgba(0, 155, 205, .035), transparent 0 28%),
    linear-gradient(180deg, rgba(1, 7, 12, .90), rgba(3, 12, 18, .82)) !important;
  backdrop-filter: blur(7px) !important;
  border: 1px solid rgba(91, 166, 196, .22) !important;
  box-shadow:
    inset 0 1px 0 rgba(214, 243, 255, .06),
    0 24px 56px rgba(0, 0, 0, .30) !important;
}
#modules #shadowiam .sm-story {
  background:
    radial-gradient(circle at 50% 38%, rgba(0, 188, 238, .045), transparent 0 25%),
    linear-gradient(180deg, rgba(1, 7, 12, .90), rgba(3, 12, 18, .82)) !important;
}
#modules #shadowthreats .sm-story {
  background:
    radial-gradient(circle at 80% 70%, rgba(145, 23, 49, .05), transparent 0 22%),
    linear-gradient(180deg, rgba(1, 7, 12, .90), rgba(3, 12, 18, .82)) !important;
}
#modules #shadowcomply .sm-story {
  background:
    radial-gradient(circle at 52% 36%, rgba(0, 146, 190, .04), transparent 0 24%),
    linear-gradient(180deg, rgba(1, 7, 12, .90), rgba(3, 12, 18, .82)) !important;
}

/* Let the local data routes visually escape the visualization card. */
#modules .sm-story-wires,
#modules .sx-story-wires {
  overflow: visible !important;
  z-index: 3 !important;
  filter: drop-shadow(0 0 5px rgba(71, 224, 255, .13));
}
#modules .sm-story-wires path.is-live,
#modules .sx-story-wires path.is-live,
#modules .sm-story-wires line.is-live,
#modules .sx-story-wires line.is-live {
  stroke-width: 1.2 !important;
  stroke-dasharray: 2 13 !important;
  opacity: .8 !important;
  animation-duration: 5.8s !important;
  filter: drop-shadow(0 0 3px rgba(70,224,255,.18)) !important;
}

/* Slightly stronger copy panels, now separated from the mesh by contrast instead of hard walls. */
#modules .mm-copy {
  border-color: rgba(74, 198, 231, .28) !important;
  background: linear-gradient(145deg, rgba(4, 16, 25, .96), rgba(2, 9, 15, .90)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 26px 66px rgba(0,0,0,.28),
    0 0 44px rgba(0, 132, 181, .025) !important;
}
#modules .mm-copy::after {
  width: 52px !important;
  right: -34px !important;
  border-color: rgba(53, 217, 255, .28) !important;
}

/* Mesh intensity follows each module's artwork. */
#shadowmap > .mihari-mesh-wave { opacity: .78; }
#shadowiam > .mihari-mesh-wave { opacity: .53; filter: saturate(.86) brightness(.85); }
#shadowthreats > .mihari-mesh-wave { opacity: .62; filter: saturate(.88); }
#shadowcomply > .mihari-mesh-wave { opacity: .58; filter: saturate(.82) brightness(.92); }
#modules .sc-heading > .mihari-mesh-wave { opacity: .62; }
#providers.cin-hybrid > .mihari-mesh-wave { opacity: .72; }

/* Hybrid fibre routes: thin, modern and driven by moving packets instead of heavy paths. */
#providers .cin-hybrid-wires .cin-wire {
  stroke: rgba(41, 157, 190, .42) !important;
  stroke-width: .82 !important;
  opacity: .62 !important;
}
#providers .cin-hybrid-wires .cin-wire-glow {
  stroke-width: 1.05 !important;
  opacity: .70 !important;
  filter: drop-shadow(0 0 5px rgba(0, 216, 255, .24)) !important;
}
#providers .cin-hybrid-wires .cin-wire-stream {
  stroke-width: 1.55 !important;
  stroke-dasharray: 2 14 !important;
  opacity: .72 !important;
  animation-duration: 1.7s !important;
  filter: drop-shadow(0 0 5px rgba(0, 220, 255, .28)) !important;
}
#providers .cin-hybrid-wires .cin-wire-ambient {
  stroke-width: .7px !important;
  stroke-dasharray: 20 130 !important;
  opacity: .36 !important;
}
#providers .cin-route-spark {
  opacity: .68;
  filter: drop-shadow(0 0 5px rgba(128, 243, 255, .58));
}

/* Keep the hybrid background tonal rather than uniformly dark. */
#providers.cin-hybrid {
  background:
    radial-gradient(circle at 50% 18%, rgba(0, 203, 255, .09), transparent 0 18%),
    radial-gradient(circle at 15% 48%, rgba(0, 101, 177, .045), transparent 0 30%),
    radial-gradient(circle at 86% 54%, rgba(0, 148, 216, .05), transparent 0 28%),
    linear-gradient(180deg, #020910 0%, #03111a 46%, #01070c 100%) !important;
}

@media (max-width: 760px) {
  .mihari-mesh-wave { opacity: .52 !important; }
}


/* ============================================================
   FINAL POLISH V3 · curved tonal transitions, hybrid blend, stronger mesh
   ============================================================ */

/* Remove hard horizontal bands between major zones. */
#modules.sc-modules,
#providers.cin-hybrid,
#blog.cin-blog {
  position: relative;
  isolation: isolate;
}

/* Divisiones uniformes: la seccion queda transparente sobre el fondo
   continuo del body (mismo estilo que la transicion features -> metrics),
   sin bandas ni degradados locales en los bordes. */
#modules.sc-modules {
  background: transparent !important;
  padding-bottom: 36px !important;
}
/* La ultima fila no duplica el espacio: el margen base de 190px tiene
   !important y debe anularse aqui, despues de la regla general. */
#modules .sm-story-row:last-of-type {
  margin-bottom: 0 !important;
}
#modules.sc-modules::after {
  content: none;
}

/* Fade vertical en los bordes de cada fila: el fondo fluye continuo
   entre filas y hacia las secciones vecinas (sin bandas duras). */
#modules .sm-story-row::before,
#modules .sm-story-row::after {
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 9%, #000 91%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 9%, #000 91%, transparent 100%);
}

/* Hybrid section is darkest around its edges and lighter around the core so it no longer reads as a pasted rectangle. */
#providers.cin-hybrid {
  max-width: none !important;
  width: 100% !important;
  padding-left: max(clamp(24px, 4vw, 66px), calc((100vw - 1510px) / 2 + 48px)) !important;
  padding-right: max(clamp(24px, 4vw, 66px), calc((100vw - 1510px) / 2 + 48px)) !important;
  padding-top: 118px !important;
  padding-bottom: 132px !important;
  overflow: hidden !important;
  background: transparent !important;
}
#providers.cin-hybrid::after {
  content: none;
}
#providers.cin-hybrid > *:not(.mihari-wave-field):not(.mihari-mesh-wave) {
  z-index: 3 !important;
}
#providers .cin-hybrid-stage {
  border-radius: 44px;
  padding: 18px 10px 20px !important;
  background:
    radial-gradient(circle at 50% 34%, rgba(0, 214, 255, .06), transparent 0 23%),
    linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.08));
  box-shadow: none !important;
}
#providers .cin-environments {
  margin-top: 68px !important;
}
#providers .cin-env {
  background:
    radial-gradient(circle at 50% 8%, rgba(0, 196, 236, .055), transparent 26%),
    linear-gradient(145deg, rgba(3, 15, 23, .86), rgba(1, 8, 13, .72)) !important;
  border-color: rgba(67, 185, 216, .20) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 22px 52px rgba(0,0,0,.18) !important;
}
#providers .cin-cloud-notice,
#providers .cin-hybrid-stats {
  background: linear-gradient(145deg, rgba(2, 13, 20, .90), rgba(1, 7, 12, .82)) !important;
  border-color: rgba(62, 184, 214, .19) !important;
}

/* Slightly stronger living surface so the wave can be read throughout every module. */
.mihari-mesh-wave {
  opacity: .90 !important;
  filter: saturate(1.02) brightness(1.04);
}
#shadowmap > .mihari-mesh-wave { opacity: .92 !important; }
#shadowiam > .mihari-mesh-wave { opacity: .68 !important; filter: saturate(.94) brightness(.92); }
#shadowthreats > .mihari-mesh-wave { opacity: .76 !important; filter: saturate(.95) brightness(.98); }
#shadowcomply > .mihari-mesh-wave { opacity: .72 !important; filter: saturate(.90) brightness(.96); }
#modules .sc-heading > .mihari-mesh-wave { opacity: .78 !important; }
#providers.cin-hybrid > .mihari-mesh-wave { opacity: .86 !important; filter: saturate(.98) brightness(.98); }
#blog.cin-blog > .mihari-mesh-wave { opacity: .86 !important; }

/* Fade the mesh naturally into the next section rather than ending on a hard edge. */
#modules .sm-story-row,
#modules .sc-heading,
#providers.cin-hybrid,
#blog.cin-blog {
  --mesh-edge-fade: linear-gradient(to bottom, transparent 0%, #000 10%, #000 88%, transparent 100%);
}
#modules .sm-story-row > .mihari-mesh-wave,
#modules .sc-heading > .mihari-mesh-wave,
#providers.cin-hybrid > .mihari-mesh-wave,
#blog.cin-blog > .mihari-mesh-wave {
  -webkit-mask-image: var(--mesh-edge-fade);
  mask-image: var(--mesh-edge-fade);
}

/* Blog-to-footer transition: full-bleed dark footer with a soft curved fade instead of an inset black box. */
#blog.cin-blog {
  padding-bottom: 154px !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}
/* La animacion es identica a la de las paginas /blog/: campo de olas con
   spread a lo largo de toda la seccion y la malla como banda media; ambas se
   prolongan bajo el footer (transparente). */
#blog.cin-blog > .mihari-wave-field {
  top: 0 !important;
  bottom: -240px !important;
  height: auto !important;
}
#blog.cin-blog {
  /* el lienzo ahora llega hasta el final del footer: el desvanecimiento
     inferior cae justo al pie de la pagina, no en medio del footer */
  --mesh-edge-fade: linear-gradient(to bottom, transparent 0%, #000 10%, #000 96%, transparent 100%);
}
#blog.cin-blog::after {
  content: none;
}

/* ============================================================
   HYBRID FINAL PASS · entornos sin marco + canales dibujados por scroll
   ============================================================ */

/* Las tarjetas de entorno pierden el marco: las imagenes flotan sobre el fondo. */
#providers .cin-env {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#providers .cin-env:hover {
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Los canales y sus flujos solo existen una vez dibujados al hacer scroll. */
#providers .cin-hybrid-wires:not(.is-live) .cin-wire-stream,
#providers .cin-hybrid-wires:not(.is-live) .cin-wire-ambient,
#providers .cin-hybrid-wires:not(.is-live) .cin-route-spark,
#providers .cin-hybrid-wires:not(.is-live) .cin-wire-node,
#providers .cin-hybrid-wires:not(.is-live) .cin-packet,
#providers .cin-hybrid-wires:not(.is-live) .cin-pulse {
  opacity: 0 !important;
}
#providers .cin-hybrid-wires.is-live .cin-wire-stream,
#providers .cin-hybrid-wires.is-live .cin-wire-ambient,
#providers .cin-hybrid-wires.is-live .cin-route-spark,
#providers .cin-hybrid-wires.is-live .cin-wire-node {
  transition: opacity .7s ease .12s;
}

