/* ============================================================ PREMIUM LAYER (v2) — 26 Sept 2026 Owner: "kuch buttons aur kuch cheezein over-designed hain … professional design chahiye … bahut zyada premiumness … enough white space … theme ka colour same rahega." Sirf wale pages par lagta hai (main.css ke upar). Content nahi badalta. Chhune ki manahi: syllabus section, mobile floating buttons (.sqfab), header "Get App". ============================================================ */ html.v2 { --bg: #f5f3ee; --bg-elev: #fbfaf7; --paper: #ffffff; --ink: #0d0d0d; --ink-2: #262626; --muted: #5f5d58; --muted-2: #8f8c85; --line: #e4e0d6; --line-soft: rgba(13, 13, 13, .07); --gold: #b58a00; /* yellow-deep, cream par thoda gehra — padhne me saaf */ --yellow-deep: #b58a00; --shadow-sm: 0 1px 2px rgba(40, 32, 10, .05), 0 2px 8px rgba(40, 32, 10, .04); --shadow-md: 0 2px 6px rgba(40, 32, 10, .05), 0 18px 40px -18px rgba(40, 32, 10, .18); --r-lg: 22px; --r-md: 14px; --r-sm: 10px; --sec: clamp(88px, 10vw, 136px); --container: 1200px; } /* ---------- MOUSE (26 Sept hotfix) ---------- main.css desktop par `body, a, button { cursor: none !important }` lagata hai (custom peela ring ke liye). Ring JS se banta hai — JS late ho, mouse window se bahar-andar aaye, ya iframe (map) par ho to ring nahi dikhta aur asli mouse bhi chhupa rehta — owner: "desktop me aksar mouse dikhna band ho jata hai". v2 me ring hai hi nahi → asli mouse wapas. */ html.v2 body { cursor: auto !important; } html.v2 a, html.v2 button, html.v2 .btn, html.v2 [role="button"], html.v2 summary, html.v2 label[for] { cursor: pointer !important; } html.v2 input, html.v2 textarea { cursor: text !important; } html.v2 select { cursor: pointer !important; } html.v2 body { font-feature-settings: 'cv11', 'ss01'; text-rendering: auto; } /* ---------- motion: shaant, chhota ---------- */ html.v2 .reveal { transform: translateY(14px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out); will-change: auto; } html.v2 .reveal.in { transform: none; } html.v2 .orb, html.v2 #hero-canvas, html.v2 .cc-ring, html.v2 .cc-dot { display: none !important; } html.v2 .scroll-progress { height: 2px; opacity: .9; } /* ---------- typography ---------- */ html.v2 h2, html.v2 h3 { text-wrap: balance; } html.v2 p { text-wrap: pretty; } html.v2 .eyebrow, html.v2 .blog-strip-eyebrow, html.v2 .agency-eyebrow { font-size: 11.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin-bottom: 22px; gap: 12px; } html.v2 .eyebrow .line { width: 22px; opacity: .6; } html.v2 .h2 { font-size: clamp(34px, 4.1vw, 54px); line-height: 1.06; letter-spacing: -.028em; margin-bottom: 20px; max-width: 760px; } html.v2 .h2 em { color: var(--gold); } html.v2 .intro { font-size: 17.5px; line-height: 1.65; color: var(--muted); max-width: 580px; } /* ---------- sections: ek hi cream zameen, patli line se alag ---------- */ html.v2 .section { padding: var(--sec) 0; } html.v2 .section-soft { background: var(--bg-elev); } html.v2 main > section + section, html.v2 body > section + section { border-top: 1px solid var(--line-soft); } html.v2 .section-dark { background: #0c0c0b; } html.v2 .section-dark .eyebrow { color: rgba(255, 214, 10, .85); } /* ---------- buttons (Get App + .sqfab alag class hain — chhue nahi) ---------- */ html.v2 .btn { padding: 14px 24px; font-size: 15px; font-weight: 600; letter-spacing: -.005em; border-width: 1px; gap: 10px; overflow: visible; transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease; } html.v2 .btn::before { display: none; } html.v2 .btn:active { transform: translateY(1px) scale(.99); } html.v2 .btn .arrow { font-size: .95em; } html.v2 .btn-primary { background: var(--ink); color: #fff; box-shadow: 0 1px 0 rgba(255,255,255,.08) inset, 0 8px 20px -10px rgba(13,13,13,.5); } html.v2 .btn-primary:hover { background: #262626; color: #fff; transform: translateY(-1px); box-shadow: 0 1px 0 rgba(255,255,255,.08) inset, 0 12px 26px -12px rgba(13,13,13,.55); } html.v2 .btn-primary:hover .arrow { transform: translateX(3px); } html.v2 .btn-ghost { background: transparent; color: var(--ink); border-color: rgba(13,13,13,.18); } html.v2 .btn-ghost:hover { background: rgba(13,13,13,.04); color: var(--ink); border-color: rgba(13,13,13,.45); transform: none; } html.v2 .btn-yellow { background: var(--yellow); color: var(--ink); box-shadow: none; } html.v2 .btn-yellow:hover { background: #ffe14d; color: var(--ink); transform: translateY(-1px); box-shadow: 0 10px 24px -12px rgba(255, 214, 10, .6); } html.v2 .btn-yellow:hover .arrow { transform: translateX(3px); } html.v2 .section-dark .btn-ghost, html.v2 .final-cta .btn-ghost { color: #fff; border-color: rgba(255,255,255,.22); } html.v2 .section-dark .btn-ghost:hover, html.v2 .final-cta .btn-ghost:hover { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.5); color: #fff; } html.v2 :focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 6px; } /* ---------- header: shaant ---------- */ html.v2 .site-header { background: rgba(245, 243, 238, .82); -webkit-backdrop-filter: saturate(140%) blur(14px); backdrop-filter: saturate(140%) blur(14px); } html.v2 .site-header.scrolled { box-shadow: 0 1px 0 var(--line-soft); } /* ============================================================ HOME ============================================================ */ html.v2 .hero { padding: clamp(40px, 6vw, 72px) 0 clamp(64px, 8vw, 104px); } html.v2 .hero-grid { grid-template-columns: 1.12fr .88fr; gap: clamp(40px, 6vw, 88px); } html.v2 .hero-eyebrow { font-size: 11.5px; letter-spacing: .16em; margin-bottom: 28px; color: var(--muted); gap: 10px; flex-wrap: wrap; } html.v2 .hero-eyebrow .pulse::before { animation: none; opacity: 0; } html.v2 .hero-eyebrow .pulse { background: var(--gold); width: 6px; height: 6px; } html.v2 .hero h1 { font-size: clamp(44px, 6vw, 80px); line-height: .98; letter-spacing: -.034em; margin-bottom: 28px; } html.v2 .hero h1 em { color: var(--gold); } html.v2 .hero h1 em::after { display: none; } html.v2 .hero h1 .ink-highlight::before { height: .26em; bottom: .08em; opacity: .9; } html.v2 .hero-sub { font-size: 18px; line-height: 1.65; max-width: 540px; margin-bottom: 36px; } html.v2 .hero-cta-row { gap: 12px; } html.v2 .hero-visual { border-radius: var(--r-lg); box-shadow: var(--shadow-md); } html.v2 .hero-visual-tag { display: none; } html.v2 .hero-visual-name .role { letter-spacing: .14em; font-size: 10.5px; } html.v2 .hero-floating-card { transform: none !important; rotate: none; background: #fff; color: var(--ink); border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow-md); padding: 14px 18px; right: -18px; bottom: -22px; } html.v2 .hero-floating-card .num { font-size: 17px; } html.v2 .hero-floating-card .label { color: var(--muted); letter-spacing: .08em; } /* founder strip: kaali patti ki jagah hero ke neeche shaant facts row */ html.v2 .founder-strip { background: transparent; color: var(--ink); padding: 0; } html.v2 .founder-strip-inner { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 22px 0; justify-content: space-between; gap: 18px 28px; } html.v2 .founder-strip-item { color: var(--muted); font-size: 14px; } html.v2 .founder-strip-item b { color: var(--ink); } html.v2 .founder-strip-item i { color: var(--gold); font-size: 13px; } /* marquee: shor kam */ html.v2 .marquee { background: transparent; border: 0; padding: 18px 0 6px; color: var(--muted-2); } html.v2 .marquee-track { animation-duration: 70s; font-size: 14px; font-weight: 500; } html.v2 .marquee-track span { color: var(--muted-2); } html.v2 .marquee .m-dot { color: var(--gold); opacity: .6; } /* journey */ html.v2 .journey-badge-floating { transform: none !important; } html.v2 .journey-photo-main, html.v2 .journey-photo-secondary { border-radius: var(--r-lg); } /* services — card border halka, icon tile shaant */ html.v2 .services-grid { gap: 20px; } html.v2 .service-card { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); padding: clamp(28px, 3vw, 38px); transition: box-shadow .25s ease, transform .25s ease; } html.v2 .service-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); } html.v2 .service-icon { background: var(--bg); color: var(--ink); border: 1px solid var(--line); border-radius: 12px; } html.v2 .service-icon i { color: var(--ink); } /* agency: peela poora section → cream, peela sirf accent */ html.v2 .agency-section { background: var(--bg-elev); color: var(--ink); } html.v2 .agency-section::before, html.v2 .agency-section::after { display: none; } html.v2 .agency-eyebrow { background: transparent; color: var(--muted); padding: 0; } html.v2 .agency-service-pill { background: #fff; border: 1px solid var(--line); color: var(--ink-2); font-weight: 500; } html.v2 .agency-stats { background: var(--ink); border-radius: var(--r-lg); box-shadow: var(--shadow-md); } /* free content: kaale bhari card → halke */ html.v2 .content-grid { gap: 20px; } html.v2 .content-card { background: var(--paper); color: var(--ink); border: 1px solid var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); } html.v2 .content-card::before, html.v2 .content-card::after { display: none; } html.v2 .content-card h3, html.v2 .content-card .serif { color: var(--ink); } html.v2 .content-card p { color: var(--muted); } html.v2 .content-card-eyebrow { color: var(--gold); } html.v2 .content-card-icon { background: var(--bg); color: var(--ink); border: 1px solid var(--line); } html.v2 .content-card-link { color: var(--ink); border-color: rgba(13,13,13,.18); background: transparent; } html.v2 .content-card-link:hover { border-color: var(--ink); } html.v2 .content-card-photo { border: 0; padding: 0; } /* courses (ek hi dark band) — 9 card = 3x3, akela card nahi */ html.v2 .learn-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; } html.v2 .learn-card-wide { grid-column: 1 / -1; } html.v2 .learn-card { background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.08); border-radius: var(--r-md); transition: border-color .2s ease, background-color .2s ease; } html.v2 .learn-card:hover { border-color: rgba(255,214,10,.45); background: rgba(255,255,255,.05); transform: none; } html.v2 .learn-card-tag { border-radius: 6px; letter-spacing: .1em; } html.v2 .learn-card-wide { background: linear-gradient(135deg, rgba(255,214,10,.10), rgba(255,255,255,.03) 60%); border-color: rgba(255,214,10,.28); } /* off duty polaroids: seedhe, kam jhukav */ html.v2 .polaroid { transform: none !important; box-shadow: var(--shadow-sm); border-radius: 10px; } /* app */ html.v2 .appshow { background: var(--bg-elev); color: var(--ink); } html.v2 .appshow .eyebrow { color: var(--muted); } html.v2 .appshow h2, html.v2 .appshow .h2 { color: var(--ink); } html.v2 .appshow .h2 em { color: var(--gold); } html.v2 .appshow p, html.v2 .appshow-copy > p { color: var(--muted); } html.v2 .appshow p b, html.v2 .appshow-copy > p b { color: var(--ink); } html.v2 .appshow-point h4, html.v2 .appshow-point b, html.v2 .appshow-point strong { color: var(--ink); } html.v2 .appshow-point p, html.v2 .appshow-point span { color: var(--muted); } html.v2 .ap-ic { background: var(--ink); color: var(--yellow); } html.v2 .appshow-badge { background: #fff; border-color: var(--line); color: var(--ink-2); } html.v2 .appshow-dl-note { color: var(--muted); } html.v2 .appshow::before, html.v2 .appshow::after { display: none; } /* reviews */ html.v2 .gr-card { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-md); box-shadow: var(--shadow-sm); } html.v2 .gr-avatar { background: var(--bg) !important; color: var(--ink) !important; border: 1px solid var(--line); } html.v2 .gr-cta { border-color: rgba(13,13,13,.18); } /* final CTA */ html.v2 .final-cta { background: #0c0c0b; } html.v2 .final-cta::before, html.v2 .final-cta::after { opacity: .35; } html.v2 .enquiry-form input, html.v2 .enquiry-form select { border-radius: 12px; } /* blog strip */ html.v2 .blog-strip { background: var(--bg); } html.v2 .blog-strip-card { border: 1px solid var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); } html.v2 .blog-strip-card:hover { box-shadow: var(--shadow-md); } @media (max-width: 1024px) { html.v2 .learn-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 900px) { html.v2 .hero-grid { grid-template-columns: 1fr; } html.v2 .founder-strip-inner { justify-content: flex-start; } html.v2 .hero-floating-card { right: 12px; bottom: -18px; } } @media (max-width: 640px) { html.v2 .learn-grid { grid-template-columns: 1fr; } html.v2 .hero h1 { font-size: clamp(40px, 11vw, 52px); } html.v2 .hero-sub { font-size: 16.5px; } html.v2 .founder-strip-inner { display: grid; grid-template-columns: 1fr 1fr; } } /* ---- round 2 (screenshot review) ---- */ html.v2 .hero h1 { text-wrap: wrap; } html.v2 .section-dark .intro, html.v2 .learn-head p { color: rgba(255,255,255,.62); } html.v2 .learn-card-tag { background: transparent !important; border: 0 !important; padding: 0 !important; color: rgba(255,255,255,.5) !important; font-size: 10.5px; letter-spacing: .14em; } html.v2 .learn-card-wide .learn-card-tag { color: var(--yellow) !important; } html.v2 .learn-card h3 em, html.v2 .learn-card .serif em { color: rgba(255,214,10,.85); } html.v2 .service-card { display: flex; flex-direction: column; } html.v2 .service-card .service-link { margin-top: auto; padding-top: 8px; } html.v2 .service-list { margin-bottom: 28px; } html.v2 .content-grid { grid-template-columns: repeat(3, 1fr); align-items: stretch; } html.v2 .content-card { display: flex; flex-direction: column; } html.v2 .content-card .content-card-link { margin-top: auto; align-self: flex-start; } html.v2 .content-card h3 em, html.v2 .content-card .serif em { color: var(--gold); } html.v2 .content-card-photo { position: relative; overflow: hidden; min-height: 100%; } html.v2 .content-card-photo img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; } html.v2 .content-photo-caption { background: rgba(13,13,13,.72); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-radius: 10px; } /* blog strip: laal/hara/baingani gradient → brand ke andar (ink + cream), icon peela */ html.v2 .blog-strip-thumb { background: linear-gradient(160deg, #1a1a18, #0c0c0b) !important; } html.v2 .blog-strip-thumb:nth-child(n) .blog-strip-icon { color: var(--yellow); filter: none; opacity: .92; } html.v2 .blog-strip-card:nth-child(2) .blog-strip-thumb { background: linear-gradient(160deg, #efe9da, #e4dcc6) !important; } html.v2 .blog-strip-card:nth-child(2) .blog-strip-icon { color: var(--ink); } html.v2 .blog-strip-gloss { display: none; } html.v2 .blog-strip-pill { background: rgba(255,255,255,.14); color: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; font-weight: 600; } html.v2 .blog-strip-card:nth-child(2) .blog-strip-pill { background: rgba(13,13,13,.08); color: var(--ink); } @media (max-width: 900px) { html.v2 .content-grid { grid-template-columns: 1fr; } html.v2 .content-card-photo { min-height: 320px; } } @media (min-width: 901px) { html.v2 .hero-grid { grid-template-columns: 1.28fr .92fr; } html.v2 .hero h1 { font-size: clamp(44px, 5.6vw, 78px); } } @media (max-width: 640px) { html.v2 .hero-eyebrow { font-size: 10.5px; letter-spacing: .12em; gap: 6px 8px; margin-bottom: 22px; } html.v2 .hero-eyebrow .divider { width: 10px; } html.v2 .hero-visual-wrap { margin-top: 8px; } } @media (max-width: 900px) { /* mobile: facts ki chalti patti → shaant 2-column grid */ html.v2 .founder-strip { white-space: normal; padding: 0; } html.v2 .founder-strip-inner { animation: none; transform: none; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; padding: 20px 24px; flex-wrap: wrap; } html.v2 .founder-strip-item { font-size: 13px; line-height: 1.35; align-items: flex-start; } html.v2 .founder-strip-item:last-child { grid-column: 1 / -1; } } @media (max-width: 640px) { /* courses: mobile par lambi list chhoti karo — 2 column compact */ html.v2 .learn-grid { grid-template-columns: 1fr 1fr; gap: 10px; } html.v2 .learn-card { padding: 18px 16px; } html.v2 .learn-card-wide { grid-column: 1 / -1; padding: 22px 20px; } html.v2 .learn-card h3, html.v2 .learn-card .serif { font-size: 17px; line-height: 1.2; } html.v2 .learn-card-meta { gap: 5px; padding-top: 12px; } html.v2 .learn-card-meta span { font-size: 11.5px; } } /* ============================================================ COURSE PAGES (course.css ke upar) ============================================================ */ html.v2 .course-hero::before, html.v2 .course-hero::after { display: none; } html.v2 .course-hero h1 { letter-spacing: -.032em; } html.v2 .course-hero h1 em { color: var(--gold); } html.v2 .hero-card-tag { display: none; } html.v2 .hero-card-main { border-radius: var(--r-lg); box-shadow: var(--shadow-md); } html.v2 .hero-floating-sticker { transform: none !important; rotate: none; animation: none !important; background: #fff; color: var(--ink); border: 1px solid var(--line); box-shadow: var(--shadow-md); border-radius: var(--r-md); font-family: inherit; } html.v2 .hero-floating-sticker .sticker-arrow { color: var(--gold); } html.v2 .hero-floating-cred { box-shadow: var(--shadow-md); border: 1px solid var(--line-soft); } html.v2 .badge-live { background: var(--ink); } html.v2 .badge-live .pulse::before { animation: none; } html.v2 .course-hero-stats { border-color: var(--line); } /* peele emoji tiles → shaant cream tile */ html.v2 .who-card { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); } html.v2 .who-icon { background: var(--bg) !important; border: 1px solid var(--line); border-radius: 12px; } /* book: poora peela section → cream, kitaab hi accent */ html.v2 .book-section { background: var(--bg-elev); } html.v2 .book-section::before, html.v2 .book-section::after { display: none; } html.v2 .book-eyebrow { background: transparent; color: var(--muted); padding: 0; letter-spacing: .16em; font-size: 11.5px; } html.v2 .book-feature { background: #fff; border: 1px solid var(--line); color: var(--ink-2); } html.v2 .book-feature i { color: var(--gold); } html.v2 .book { transform: rotate(-2deg) !important; box-shadow: 0 30px 60px -24px rgba(40,32,10,.45); } html.v2 .sq-roles span, html.v2 .sq-roles a, html.v2 .sq-roles li { background: #fff; border-color: var(--line); } /* dark CTA par primary = peela (ink-on-ink nahi) */ html.v2 .final-cta .btn-primary, html.v2 .section-dark .btn-primary { background: var(--yellow); color: var(--ink); box-shadow: none; } html.v2 .final-cta .btn-primary:hover, html.v2 .section-dark .btn-primary:hover { background: #ffe14d; color: var(--ink); } /* related courses: 6 card = 3x2 */ html.v2 .related-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; } html.v2 .related-card { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-md); box-shadow: var(--shadow-sm); } html.v2 .related-card.featured { background: var(--ink); } @media (min-width: 901px) { html.v2 .course-hero h1 { font-size: clamp(40px, 4.4vw, 62px); } } @media (max-width: 900px) { html.v2 .related-grid { grid-template-columns: 1fr 1fr; } } @media (max-width: 520px) { html.v2 .related-grid { grid-template-columns: 1fr; } } /* ============================================================ SERVICE PAGES (expertise.css ke upar) ============================================================ */ html.v2 .expertise-hero::before, html.v2 .expertise-hero::after { display: none; } html.v2 .expertise-floating-badge { transform: none !important; animation: none !important; rotate: none; background: #fff; color: var(--ink); border: 1px solid var(--line); box-shadow: var(--shadow-md); border-radius: var(--r-md); } html.v2 .expertise-floating-badge .label { color: var(--muted); } html.v2 .problem-card { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); } html.v2 .problem-card.problem { background: var(--bg); box-shadow: none; border-color: var(--line); } html.v2 .problem-card-tag { background: transparent !important; color: var(--muted) !important; padding: 0 !important; letter-spacing: .14em; } html.v2 .problem-card.problem .problem-card-tag { color: #b4232a !important; } html.v2 .problem-card:not(.problem) .problem-card-tag { color: var(--gold) !important; } html.v2 .service-row-tag, html.v2 .result-card-industry { background: transparent !important; color: var(--muted) !important; padding: 0 !important; border: 0 !important; letter-spacing: .14em; } html.v2 .result-card, html.v2 .service-row { background: var(--paper); border: 1px solid var(--line-soft); box-shadow: var(--shadow-sm); } html.v2 .section-dark p { color: rgba(255,255,255,.62); } @media (max-width: 640px) { html.v2 .journey-photo-secondary { right: 0; bottom: -18px; transform: none; } } /* ============================================================ ABOUT ============================================================ */ html.v2 .about-hero::before, html.v2 .about-hero::after { display: none; } html.v2 .portrait-tag { display: none; } html.v2 .portrait-main { border-radius: var(--r-lg); box-shadow: var(--shadow-md); } html.v2 .story-photo-badge { background: var(--ink); color: #fff; transform: none; } html.v2 .story-photo-badge * { color: inherit; } html.v2 .story-quote { background: var(--paper); border: 1px solid var(--line-soft); box-shadow: var(--shadow-sm); } /* 5 skill card: 3 + 2 (neeche wale do poori chaudai baantein, akela khali khana nahi) */ @media (min-width: 901px) { html.v2 .skills-grid { grid-template-columns: repeat(6, 1fr); gap: 14px; } html.v2 .skills-grid > .skill-card { grid-column: span 2; } html.v2 .skills-grid > .skill-card:nth-last-child(2):nth-child(3n+1), html.v2 .skills-grid > .skill-card:nth-last-child(1):nth-child(3n+2) { grid-column: span 3; } } html.v2 .skill-card { background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.08); border-radius: var(--r-md); } html.v2 .skill-icon { background: rgba(255,214,10,.12) !important; color: var(--yellow) !important; } html.v2 .skill-icon i { color: var(--yellow); } /* social: rang-birange brand tile → ek jaise ink tile */ html.v2 .presence-icon, html.v2 .presence-icon.yt, html.v2 .presence-icon.sp, html.v2 .presence-icon.ln, html.v2 .presence-icon.ig { background: var(--ink) !important; color: #fff; } html.v2 .presence-card, html.v2 .value-card, html.v2 .venture-card { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); } html.v2 .value-num { color: var(--gold) !important; } html.v2 .venture-card-logo, html.v2 .venture-card-logo.search, html.v2 .venture-card-logo.reckon, html.v2 .venture-card-logo.albahar { background: var(--ink) !important; color: var(--yellow); } /* ============================================================ CONTACT ============================================================ */ html.v2 .contact-hero::before, html.v2 .contact-hero::after { display: none; } html.v2 .quick-tile, html.v2 .info-card { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-md); box-shadow: var(--shadow-sm); } html.v2 .quick-icon, html.v2 .quick-icon.wa, html.v2 .quick-icon.ln { background: var(--ink) !important; color: #fff !important; } html.v2 .info-card-icon { background: var(--bg) !important; color: var(--ink) !important; border: 1px solid var(--line); } html.v2 .info-card-link { color: var(--ink); } /* ============================================================ BLOG LISTING — rang-birange thumbnails → brand ke andar ============================================================ */ html.v2 .blog-hero::before, html.v2 .blog-hero::after, html.v2 .blogs-hero::before, html.v2 .blogs-hero::after { display: none; } html.v2 .post-thumb { background: linear-gradient(160deg, #1b1b19, #0c0c0b) !important; } html.v2 .post-thumb .post-thumb-icon { color: var(--yellow) !important; opacity: .9; } html.v2 .post-card:nth-child(3n+2) .post-thumb { background: linear-gradient(160deg, #efe9da, #e2d9c2) !important; } html.v2 .post-card:nth-child(3n+2) .post-thumb .post-thumb-icon { color: var(--ink) !important; } html.v2 .thumb-bg-pattern { opacity: .25; } html.v2 .post-card, html.v2 .featured-post { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); } html.v2 .post-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); } html.v2 .featured-tag { background: transparent !important; color: var(--gold) !important; padding: 0 !important; letter-spacing: .14em; } html.v2 .post-thumb-label { background: rgba(255,255,255,.14); color: #fff; } /* blog post: lamba shabd/URL mobile par page ko chauda na kare (live par bhi tha — 486px) */ html.v2 .post-layout > * { min-width: 0; } html.v2 .post-content, html.v2 .post-toc { overflow-wrap: anywhere; } html.v2 .post-content table { display: block; max-width: 100%; overflow-x: auto; } /* har page ke hero ke peeche ka peela glow (legal/blog/portfolio…) */ html.v2 section[class*="hero"]::before, html.v2 section[class*="hero"]::after { display: none; } html.v2 .course-hero h1 { text-wrap: balance; } /* ============================================================ SURAKSHA: syllabus ([data-syllabus] — #curriculum / #roadmap / vibe #learn) ka design NAHI badalna — owner: "Syllabus wala chapter redesign nahi karna hai." Upar ke global v2 rules yahan main.css/course.css wale purane values par wapas. ============================================================ */ html.v2 [data-syllabus] { --muted: #6b6b6b; --muted-2: #9a9a9a; --line: #e6e3da; --bg-elev: #ffffff; --yellow-deep: #c79900; --container: 1240px; padding: 120px 0; background: var(--black); border-top: 0; } html.v2 [data-syllabus] .eyebrow { font-size: 12px; letter-spacing: 2.5px; margin-bottom: 20px; gap: 10px; color: var(--yellow); } html.v2 [data-syllabus] .eyebrow .line { width: 30px; opacity: 1; } html.v2 [data-syllabus] .h2 { font-size: clamp(34px, 4.5vw, 58px); line-height: 1.04; letter-spacing: -0.03em; margin-bottom: 22px; max-width: 820px; } html.v2 [data-syllabus] .h2 em { color: var(--yellow); } html.v2 [data-syllabus] .intro { font-size: 17px; line-height: 1.6; max-width: 620px; color: #aaa; } html.v2 [data-syllabus] h1, html.v2 [data-syllabus] h2, html.v2 [data-syllabus] h3, html.v2 [data-syllabus] p { text-wrap: wrap; } html.v2 [data-syllabus] .reveal { transform: translateY(28px); transition: opacity 0.9s var(--ease-out), transform 0.9s var(--ease-out); } html.v2 [data-syllabus] .reveal.in { transform: translateY(0); }