/* Continuum Innovative — presentation primitives v2 */

.ci-frame{
  position:relative;
  border-radius:8px;
  padding:1.75rem 1.5rem;
  background:
    radial-gradient(140% 90% at 0% 0%, rgba(94,201,222,0.09), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%),
    rgba(10,18,38,0.55);
  border:1px solid rgba(94,201,222,0.22);
  box-shadow:
    0 30px 80px -40px rgba(0,0,0,0.7),
    inset 0 1px 0 rgba(255,255,255,0.05);
  overflow:hidden;
}
@media (min-width:768px){ .ci-frame{ padding:2.25rem 2.25rem; border-radius:10px; } }
.ci-frame::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent 0%, rgba(94,201,222,0.9) 15%, rgba(94,201,222,0.9) 85%, transparent 100%);
}
.ci-frame::after{
  content:"";
  position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background:radial-gradient(60% 40% at 100% 100%, rgba(94,201,222,0.06), transparent 70%);
}
.ci-frame > *{ position:relative; }
.ci-frame > * + *{ margin-top:1rem; }
.ci-frame p{ font-family:"Cormorant Garamond", serif; font-size:1rem; line-height:1.7; color:rgba(255,255,255,0.94); }
@media (min-width:768px){ .ci-frame p{ font-size:1.125rem; } }
.ci-frame p + p{ margin-top:0.9rem; }

.ci-frame-light{
  background:linear-gradient(180deg, rgba(15,26,50,0.04) 0%, rgba(15,26,50,0.02) 100%);
  border:1px solid rgba(15,26,50,0.10);
  box-shadow:0 20px 60px -35px rgba(15,26,50,0.25);
}
.ci-frame-light p{ color:rgba(20,28,50,0.9); }

.ci-kicker{
  font-family:"Inter", sans-serif;
  font-size:10px; font-weight:600; letter-spacing:0.22em; text-transform:uppercase;
  color:rgba(94,201,222,0.95);
  display:inline-flex; align-items:center; gap:.5rem;
}
.ci-kicker::after{ content:""; display:inline-block; width:28px; height:1px; background:rgba(94,201,222,0.6); }

.ci-quote{
  position:relative;
  border-left:2px solid rgba(94,201,222,0.75);
  background:rgba(255,255,255,0.03);
  padding:1.5rem 1.5rem 1.5rem 2rem;
  border-radius:4px;
  backdrop-filter:blur(4px);
}
.ci-quote::before{
  content:"\201C";
  position:absolute; top:-.5rem; left:1rem;
  font-family:"Cormorant Garamond", serif;
  font-size:4.5rem; line-height:1; color:rgba(94,201,222,0.55);
}
.ci-quote p{ font-family:"Cormorant Garamond", serif; font-style:italic;
  font-size:1.125rem; line-height:1.55; color:rgba(255,255,255,0.95); }
@media (min-width:768px){ .ci-quote p{ font-size:1.25rem; } }
.ci-quote-cite{ display:block; margin-top:.9rem; font-family:"Inter", sans-serif;
  font-size:10px; font-weight:600; letter-spacing:0.22em; text-transform:uppercase;
  color:rgba(94,201,222,0.95); font-style:normal; }

/* Pillar grid — one component. If items are anchors, we get hover/focus. */
.ci-pillar-grid{
  display:grid; grid-template-columns:1fr; gap:.7rem;
  margin-top:1.25rem;
}
@media (min-width:640px){ .ci-pillar-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:.85rem; } }
@media (min-width:1024px){ .ci-pillar-grid.ci-pillar-grid-3{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
.ci-pillar{
  position:relative; display:block;
  padding:.95rem 1.05rem;
  border:1px solid rgba(94,201,222,0.22);
  border-radius:6px;
  background:linear-gradient(180deg, rgba(94,201,222,0.08), rgba(94,201,222,0.02));
  transition:border-color .2s ease, background .2s ease, transform .2s ease;
  color:inherit; text-decoration:none;
}
a.ci-pillar:hover, a.ci-pillar:focus-visible{
  border-color:rgba(94,201,222,0.55);
  background:linear-gradient(180deg, rgba(94,201,222,0.14), rgba(94,201,222,0.04));
  transform:translateY(-1px);
  outline:none;
}
.ci-pillar-num{
  font-family:"Inter", sans-serif; font-size:10px; font-weight:700;
  letter-spacing:0.24em; color:rgba(94,201,222,0.95);
}
.ci-pillar-label{
  display:block; margin-top:.3rem;
  font-family:"Inter", sans-serif; font-weight:600;
  font-size:.9rem; line-height:1.3; color:#fff;
}

/* RTL */
[dir="rtl"] .ci-quote{ border-left:0; border-right:2px solid rgba(94,201,222,0.75); padding:1.5rem 2rem 1.5rem 1.5rem; }
[dir="rtl"] .ci-quote::before{ left:auto; right:1rem; }
