/* ========================================================== AlterMind About ========================================================== */ .about-hero{ position:relative; overflow:hidden; padding:190px 0 120px; background: radial-gradient(circle at top right, rgba(124,92,255,.18), transparent 45%), radial-gradient(circle at bottom left, rgba(0,212,255,.12), transparent 40%); } .about-hero::before{ content:""; position:absolute; inset:0; background: linear-gradient( rgba(255,255,255,.02), rgba(255,255,255,.01)); pointer-events:none; } .about-hero .section-title{ position:relative; z-index:2; max-width:900px; margin:auto; } .about-hero h1{ color:#fff; font-size:clamp(48px,6vw,70px); margin-bottom:30px; } .about-hero p{ max-width:760px; margin:auto; line-height:1.9; color:rgba(255,255,255,.75); } .about-hero .am-buttons{ margin-top:45px; justify-content:center; } .about-story, .about-mission, .about-methodology, .about-founder, .about-work, .about-timeline, .about-roadmap, .about-values, .about-faq, .about-cta{ padding:110px 0; } .about-story-content{ max-width:900px; margin:auto; } .about-story-content p{ margin-bottom:24px; line-height:1.9; font-size:1.08rem; } .founder-card{ padding:55px; border-radius:28px; background:rgba(255,255,255,.03); backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.08); } .founder-card h3{ color:#fff; margin-bottom:30px; font-size:2rem; } .founder-card p{ margin-bottom:22px; line-height:1.9; } .founder-highlights{ margin-top:60px; } .about-methodology .card{ padding:55px; border-radius:28px; background:rgba(255,255,255,.03); backdrop-filter:blur(18px); border:1px solid rgba(255,255,255,.08); } .about-methodology hr{ margin:40px 0; border:none; height:1px; background:rgba(255,255,255,.08); } .about-values .card, .about-work .card, .about-mission .card, .about-faq .faq-item{ padding:36px; border-radius:22px; background:rgba(255,255,255,.03); backdrop-filter:blur(18px); border:1px solid rgba(255,255,255,.08); transition:.35s; } .about-values .card:hover, .about-work .card:hover, .about-mission .card:hover, .about-faq .faq-item:hover{ transform:translateY(-8px); border-color:rgba(124,92,255,.28); } .about-timeline .journey-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px; } .about-timeline .journey-step{ text-align:center; padding:35px; border-radius:22px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); } .about-timeline .step-number{ width:70px; height:70px; margin:0 auto 20px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1.5rem; background:rgba(124,92,255,.12); color:var(--accent); } .about-cta .section-title{ max-width:900px; margin:auto; padding:70px 60px; border-radius:30px; background:rgba(255,255,255,.03); backdrop-filter:blur(18px); border:1px solid rgba(255,255,255,.08); } .about-cta .am-buttons{ margin-top:40px; justify-content:center; } @media(max-width:992px){ .about-timeline .journey-grid{ grid-template-columns:repeat(2,1fr); } } @media(max-width:768px){ .about-hero{ padding:130px 0 80px; } .about-story, .about-mission, .about-methodology, .about-founder, .about-work, .about-timeline, .about-roadmap, .about-values, .about-faq, .about-cta{ padding:75px 0; } .about-hero .am-buttons{ flex-direction:column; } .about-hero .btn{ width:100%; } .about-timeline .journey-grid{ grid-template-columns:1fr; } .founder-card{ padding:35px; } .about-methodology .card{ padding:35px; } .about-cta .section-title{ padding:40px 30px; } } /* ========================================================== AlterMind Ecosystem ========================================================== */ .about-ecosystem{ padding:120px 0; } .ecosystem-roadmap{ position:relative; max-width:850px; margin:70px auto 0; padding-left:40px; } .ecosystem-roadmap::before{ content:""; position:absolute; left:18px; top:0; bottom:0; width:2px; background: linear-gradient( to bottom, #3b82f6, #8b5cf6 ); opacity:.35; } .ecosystem-step{ position:relative; padding:0 0 65px 60px; } .ecosystem-dot{ position:absolute; left:-1px; top:6px; width:36px; height:36px; border-radius:50%; background:#0f172a; border:3px solid #4f8cff; box-shadow:0 0 20px rgba(79,140,255,.4); } .ecosystem-dot.glow{ border-color:#8b5cf6; box-shadow: 0 0 18px rgba(139,92,246,.6), 0 0 40px rgba(139,92,246,.35); } .ecosystem-content{ padding:30px; border-radius:22px; background:rgba(255,255,255,.03); backdrop-filter:blur(18px); border:1px solid rgba(255,255,255,.08); transition:.35s; } .ecosystem-content:hover{ transform:translateX(8px); border-color:rgba(139,92,246,.3); } .ecosystem-content h3{ color:#fff; margin-bottom:12px; font-size:1.5rem; } .ecosystem-content p{ line-height:1.8; color:rgba(255,255,255,.72); } @media(max-width:768px){ .ecosystem-roadmap{ padding-left:20px; } .ecosystem-step{ padding-left:45px; } .ecosystem-dot{ width:26px; height:26px; left:5px; } } /* ========================================== Center About Headings ========================================== */ .about-founder .section-title, .about-work .section-title, .about-ecosystem .section-title, .about-values .section-title, .about-faq .section-title, .about-methodology .section-title{ max-width:900px; margin:0 auto 60px; text-align:center; } .about-founder .section-title p, .about-work .section-title p, .about-ecosystem .section-title p, .about-values .section-title p, .about-faq .section-title p, .about-methodology .section-title p{ max-width:760px; margin:25px auto 0; } .about-founder .section-title p{ color:rgba(255,255,255,.72); font-size:1.15rem; letter-spacing:.5px; } .about-work .section-title h2{ max-width:900px; margin:0 auto; } .about-ecosystem .section-title h2{ max-width:850px; margin:auto; } .about-ecosystem .section-title p{ max-width:720px; margin:25px auto 0; }