/* Custom Styles for Converted About Page (No Tailwind) */
:root {
  --blue-50: #f2f7ff;
  --blue-100: #dbeafe;
  --blue-200: #bfdbfe;
  --gray-600: #4b5563;
  --black: #000;
  --transition-base: 0.6s cubic-bezier(.4,0,.2,1);
  --radius-xl: 1.5rem;
  --radius-lg: 1rem;
}

body {
  font-family: system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
  background: var(--blue-50);
  color: #111;
  -webkit-font-smoothing: antialiased;
}

.hero-section {
  background: linear-gradient(135deg, var(--blue-100), var(--blue-200));
  min-height: 70vh;
  display:flex;
  align-items:center;
}
.hero-bg-gradient { pointer-events:none; }
.hero-badge .badge-icon { width:40px; height:40px; background:#000; }
.hero-badge .badge-icon i { width:20px; height:20px; }
.hero-title { line-height:1.1; }
.hero-lead { font-size:1.25rem; line-height:1.6; }
.hero-cta i { width:20px; height:20px; }

/* Story Section */
.story-badge-icon { width:32px; height:32px; background:#000; }
.story-badge-icon i { width:16px; height:16px; color:#fff; }

.card.rounded-4 { border-radius: var(--radius-xl) !important; }
.rounded-4 { border-radius: var(--radius-xl) !important; }
.rounded-5 { border-radius: 2rem !important; }

.metric-card { text-align:center; transition:transform .4s, box-shadow .4s; }
.metric-card:hover { transform:translateY(-4px); box-shadow:0 10px 22px -8px rgba(0,0,0,.18); }
.metric-icon-wrapper { width:64px; height:64px; }
.metric-icon-wrapper i { width:32px; height:32px; }
.metric-value { font-weight:500; }

/* Differentiators */
.differentiator-badge-icon { width:40px; height:40px; }
.differentiator-badge-icon i { width:22px; height:22px; }
.highlighted-term { display:inline-block; }
.highlighted-term .underline-accent { position:absolute; left:0; bottom:-4px; width:100%; height:4px; background:rgba(0,0,0,.1); border-radius:2px; }
.diff-card { transition:transform .6s var(--transition-base), box-shadow .6s var(--transition-base), border-color .6s; }
.diff-card .opacity-number { position:absolute; top:-8px; right:-8px; width:48px; height:48px; background:#000; color:#fff; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:1.05rem; font-weight:500; opacity:.15; transition:opacity .4s; }
.diff-card:hover { transform:translateY(-6px); box-shadow:0 18px 40px -12px rgba(0,0,0,.25); }
.diff-card:hover .opacity-number { opacity:.9; }
.diff-card .bottom-gradient { position:absolute; left:0; bottom:0; width:100%; height:4px; background:linear-gradient(90deg, transparent, rgba(0,0,0,.15), transparent); opacity:0; transition:opacity .6s; }
.diff-card:hover .bottom-gradient { opacity:1; }
.indicator-pill { font-size:.85rem; letter-spacing:.4px; }
.pulse-dot { width:8px; height:8px; background:#000; border-radius:50%; position:relative; display:inline-block; animation:pulseBlink 1.8s ease-in-out infinite; }
@keyframes pulseBlink { 0%,100%{ transform:scale(.9); opacity:.4;} 50%{ transform:scale(1.3); opacity:1;} }

/* Values Section */
.value-badge-icon { width:32px; height:32px; }
.value-badge-icon i { width:16px; height:16px; }
.value-icon { width:80px; height:80px; background:linear-gradient(135deg,var(--blue-100), var(--blue-200)); }
.value-icon i { width:40px; height:40px; }
.value-card { transition:box-shadow .5s, transform .5s; }
.value-card:hover { transform:translateY(-6px); box-shadow:0 22px 46px -16px rgba(0,0,0,.25); }
.practice-box { position:relative; }
.practice-icon { width:48px; height:48px; }
.practice-icon i { width:20px; height:20px; }
.practice-text { line-height:1.5; }

/* Commitment Section */
.commitment-badge-icon { width:32px; height:32px; }
.commitment-badge-icon i { width:16px; height:16px; }
.trust-icon { width:56px; height:56px; }
.trust-icon i { width:28px; height:28px; }
.trust-card { transition:transform .5s, box-shadow .5s; }
.trust-card:hover { transform:translateY(-4px); box-shadow:0 14px 34px -10px rgba(0,0,0,.22); }
.shadow-xxl { box-shadow:0 28px 60px -18px rgba(0,0,0,.25), 0 10px 24px -8px rgba(0,0,0,.12) !important; }

/* Animations (Intersection-based) */
[data-animate] { opacity:0; transform:translateY(24px); transition:opacity var(--transition-base), transform var(--transition-base); }
[data-animate].animate-in { opacity:1; transform:translateY(0); }
[data-animate="slide-right"] { transform:translateX(-40px); }
[data-animate="slide-left"] { transform:translateX(40px); }
[data-animate="slide-right"].animate-in, [data-animate="slide-left"].animate-in { transform:translateX(0); }

/* Parallax substitute */
#hero.parallax-active { will-change: transform; }

/* Utility */
.lh-tight { line-height:1.15; }
.shadow-xl { box-shadow:0 20px 30px -8px rgba(0,0,0,.12),0 8px 16px -6px rgba(0,0,0,.08) !important; }

/* Buttons / Links */
.btn-dark { border-radius:1.25rem; font-weight:500; }
.btn-dark:hover { box-shadow:0 8px 20px -8px rgba(0,0,0,.4); }

/* Responsive display tweak for large heading sizes if needed */
@media (min-width:768px){
  .display-md { font-size:4rem; }
}
