typography_increase_heading_subheading_card_font_sizes_by_30_percent

Channel-Frontend/src/components/ui/PageHeader.tsx

@@ -12,13 +12,13 @@ export const PageHeader: React.FC<PageHeaderProps> = ({ title, subtitle, badge,
     <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4 pb-4 border-b border-ink-200">
       <div className="flex flex-col gap-1 min-w-0">
         <div className="flex items-center gap-2.5 flex-wrap">
-          <h1 className="text-xl font-bold tracking-tight text-ink-900 truncate">
+          <h1 className="text-xl page-title font-bold tracking-tight text-ink-900 truncate">
             {title}
           </h1>
           {badge && <div className="shrink-0">{badge}</div>}
         </div>
         {subtitle && (
-          <p className="text-xs font-medium text-ink-500 truncate max-w-3xl">
+          <p className="text-xs page-subtitle font-medium text-ink-500 truncate max-w-3xl">
             {subtitle}
           </p>
         )}

Channel-Frontend/src/features/assets/components/AssetCard.tsx

@@ -178,7 +178,7 @@ export const AssetCard: React.FC<AssetCardProps> = ({
             )}
           </div>
 
-          <h3 className="font-bold text-ink-900 text-sm leading-snug line-clamp-2 group-hover:text-ink-950 transition-colors" title={asset.title}>
+          <h3 className="font-bold text-ink-900 text-sm asset-card-title leading-snug line-clamp-2 group-hover:text-ink-950 transition-colors" title={asset.title}>
             {asset.title}
           </h3>
           <p className="text-[11px] font-medium text-ink-400 mt-1">

Channel-Frontend/src/features/assets/components/AssetExplorer.tsx

@@ -101,8 +101,8 @@ export const AssetExplorer: React.FC = () => {
     <div className="space-y-6 text-ink-900">
       <div className="rounded-2xl bg-ink-0 p-6 md:p-8 border border-ink-200 flex flex-col md:flex-row items-center justify-between gap-6">
         <div className="space-y-2">
-          <h1 className="text-2xl font-bold text-ink-900 md:text-3xl">Tech4Biz Asset Explorer</h1>
+          <h1 className="text-2xl explorer-title font-bold text-ink-900 md:text-3xl">Tech4Biz Asset Explorer</h1>
-          <p className="text-sm text-ink-700 max-w-xl">
+          <p className="text-sm explorer-desc text-ink-700 max-w-xl">
             Browse, preview, and download proprietary hardware IP, framework assemblies, and cloud-native building blocks licensed under your master agreements.
           </p>
         </div>

Channel-Frontend/src/features/auth/components/LoginForm.tsx

@@ -258,10 +258,10 @@ export const LoginForm: React.FC = () => {
               <OrbitingRing />
 
               <div>
-                <h1 className="text-2xl font-extrabold tracking-tight" style={{ color: 'var(--color-ink-800)' }}>
+                <h1 className="text-2xl login-form-title font-extrabold tracking-tight" style={{ color: 'var(--color-ink-800)' }}>
                   {mfaPendingEmail ? 'Verify Identity' : 'Tech4Biz Portal'}
                 </h1>
-                <p className="text-sm mt-1.5" style={{ color: 'var(--color-ink-600)' }}>
+                <p className="text-sm login-form-subtitle mt-1.5" style={{ color: 'var(--color-ink-600)' }}>
                   {mfaPendingEmail
                     ? `Code sent to ${mfaPendingEmail}`
                     : 'Enterprise hardware & software asset distribution'}

Channel-Frontend/src/index.css

@@ -594,3 +594,71 @@ body {
   background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
   animation: shimmer 1.5s linear infinite;
 }
+
+/* ============================================================
+   TYPOGRAPHY FINE-TUNING (+30% size increase)
+   ============================================================ */
+.page-title {
+  /* text-xl fallback: 1.25rem (20px) * 1.3 = 1.625rem (26px) */
+  font-size: 1.625rem !important;
+}
+.page-subtitle {
+  /* text-xs fallback: 0.75rem (12px) * 1.3 = 0.975rem (15.6px) */
+  font-size: 0.975rem !important;
+}
+.action-card-title {
+  /* text-lg fallback: 1.125rem (18px) * 1.3 = 1.4625rem (23.4px) */
+  font-size: 1.4625rem !important;
+}
+.action-card-desc {
+  /* text-xs fallback: 0.75rem (12px) * 1.3 = 0.975rem (15.6px) */
+  font-size: 0.975rem !important;
+}
+.asset-card-title {
+  /* text-sm fallback: 0.875rem (14px) * 1.3 = 1.1375rem (18.2px) */
+  font-size: 1.1375rem !important;
+}
+.explorer-title {
+  /* text-2xl fallback: 1.5rem (24px) * 1.3 = 1.95rem (31.2px) */
+  font-size: 1.95rem !important;
+}
+@media (min-width: 768px) {
+  .explorer-title {
+    /* md:text-3xl fallback: 1.875rem (30px) * 1.3 = 2.4375rem (39px) */
+    font-size: 2.4375rem !important;
+  }
+}
+.explorer-desc {
+  /* text-sm fallback: 0.875rem (14px) * 1.3 = 1.1375rem (18.2px) */
+  font-size: 1.1375rem !important;
+}
+.agreement-card-title {
+  /* text-base fallback: 1.0rem (16px) * 1.3 = 1.3rem (20.8px) */
+  font-size: 1.3rem !important;
+}
+.agreement-card-desc {
+  /* text-xs fallback: 0.75rem (12px) * 1.3 = 0.975rem (15.6px) */
+  font-size: 0.975rem !important;
+}
+.login-title {
+  /* text-3xl fallback: 1.875rem (30px) * 1.3 = 2.4375rem (39px) */
+  font-size: 2.4375rem !important;
+}
+@media (min-width: 1024px) {
+  .login-title {
+    /* lg:text-4xl fallback: 2.25rem (36px) * 1.3 = 2.925rem (46.8px) */
+    font-size: 2.925rem !important;
+  }
+}
+.login-desc {
+  /* text-sm fallback: 0.875rem (14px) * 1.3 = 1.1375rem (18.2px) */
+  font-size: 1.1375rem !important;
+}
+.login-form-title {
+  /* text-2xl fallback: 1.5rem (24px) * 1.3 = 1.95rem (31.2px) */
+  font-size: 1.95rem !important;
+}
+.login-form-subtitle {
+  /* text-sm fallback: 0.875rem (14px) * 1.3 = 1.1375rem (18.2px) */
+  font-size: 1.1375rem !important;
+}

Channel-Frontend/src/pages/ClientAgreementsPage.tsx

@@ -80,8 +80,8 @@ export const ClientAgreementsPage: React.FC = () => {
                   )}
                 </div>
 
-                <h3 className="text-base font-extrabold text-ink-900">Mutual Non-Disclosure Agreement (NDA)</h3>
+                <h3 className="text-base agreement-card-title font-extrabold text-ink-900">Mutual Non-Disclosure Agreement (NDA)</h3>
-                <p className="text-xs text-ink-500 mt-1.5 leading-relaxed font-semibold">
+                <p className="text-xs agreement-card-desc text-ink-500 mt-1.5 leading-relaxed font-semibold">
                   Required to protect proprietary IP, silicon designs, and private data sharing during development.
                 </p>
 
@@ -155,8 +155,8 @@ export const ClientAgreementsPage: React.FC = () => {
                   )}
                 </div>
 
-                <h3 className="text-base font-extrabold text-ink-900">Master Services Agreement (MSA)</h3>
+                <h3 className="text-base agreement-card-title font-extrabold text-ink-900">Master Services Agreement (MSA)</h3>
-                <p className="text-xs text-ink-500 mt-1.5 leading-relaxed font-semibold">
+                <p className="text-xs agreement-card-desc text-ink-500 mt-1.5 leading-relaxed font-semibold">
                   Defines the commercial framework, SLA guidelines, and consulting provisions for the partnership.
                 </p>
 

Channel-Frontend/src/pages/DashboardPage.tsx

@@ -119,10 +119,10 @@ export const DashboardPage = () => {
                   <div className="inline-block px-2 py-0.5 rounded-md bg-ink-50 border border-ink-200 text-xs font-bold text-ink-500 mb-3 shadow-sm">
                     {card.metrics}
                   </div>
-                  <h3 className="text-lg font-bold text-ink-900 mb-2 tracking-tight">
+                  <h3 className="text-lg action-card-title font-bold text-ink-900 mb-2 tracking-tight">
                     {card.title}
                   </h3>
-                  <p className="text-ink-500 leading-normal text-xs font-medium">
+                  <p className="text-ink-500 action-card-desc leading-normal text-xs font-medium">
                     {card.description}
                   </p>
                 </div>

Channel-Frontend/src/pages/InvitePage.tsx

@@ -89,9 +89,9 @@ export const InvitePage: React.FC = () => {
           <div className="w-16 h-16 bg-red-500/10 rounded-full flex items-center justify-center mx-auto mb-6">
             <AlertCircle className="w-8 h-8 text-red-600 dark:text-red-500" />
           </div>
-          <h2 className="text-2xl font-bold text-ink-900 mb-2">Invalid or Expired Link</h2>
+          <h2 className="text-2xl login-form-title font-bold text-ink-900 mb-2">Invalid or Expired Link</h2>
-          <p className="text-ink-500 text-sm mb-8">
+          <p className="text-sm login-form-subtitle text-ink-500 max-w-md mx-auto mb-6">
-            This invitation link is no longer valid. Please request a new invitation from your administrator.
+            The onboarding invitation link is invalid, expired, or has already been used. Please request a new invitation from your administrator.
           </p>
           <button onClick={() => navigate('/login')} className="text-ink-900 font-extrabold hover:underline">
             Return to Login
@@ -107,14 +107,12 @@ export const InvitePage: React.FC = () => {
       <div className="fixed top-0 right-0 w-[500px] h-[500px] bg-ink-900/5 rounded-full blur-[120px] pointer-events-none" />
       
       <div className="w-full max-w-md z-10">
-        <div className="text-center mb-10">
+        <div className="text-center mb-6">
           <div className="w-12 h-12 rounded-2xl bg-gradient-to-br from-ink-900 to-ink-800 shadow-xl flex items-center justify-center mx-auto mb-6">
             <Shield className="w-6 h-6 text-ink-0" />
           </div>
-          <h1 className="text-3xl font-extrabold tracking-tight mb-2">Welcome to Tech4Biz</h1>
+          <h1 className="text-3xl login-title font-extrabold tracking-tight mb-2">Welcome to Tech4Biz</h1>
-          <p className="text-sm font-medium text-ink-500">
+          <p className="text-sm login-desc text-ink-500">Please set up your password to activate your channel partner account.</p>
-            Set up your partner account for <span className="text-ink-900 font-bold">{email}</span>
-          </p>
         </div>
 
         <motion.div 

Channel-Frontend/src/pages/LoginPage.tsx

@@ -71,16 +71,15 @@ export const LoginPage = () => {
       >
         {/* Left Column - Partner Explanation */}
         <div className="md:col-span-6 lg:col-span-7 flex flex-col justify-center text-left">
-          <h1 className="text-3xl lg:text-4xl font-extrabold text-ink-900 tracking-tight leading-tight">
+          <div className="space-y-4 max-w-xl">
-            <span className="gradient-text">Tech4Biz Channel Partner</span>
+            <h1 className="text-3xl login-title lg:text-4xl font-extrabold text-ink-900 tracking-tight leading-tight">
+              Enterprise Scale, Secure Delivery
             </h1>
-          <p className="text-ink-500 text-sm mt-5 font-medium leading-relaxed max-w-lg">
+            <p className="text-ink-500 text-sm login-desc mt-5 font-medium leading-relaxed max-w-lg">
-            Expand your business by partnering with Tech4Biz and unlock new
+              Tech4Biz Channel Partner Portal facilitates authenticated, low-latency distribution of physical asset coordinates, design assets, and cryptographically verified legal agreements.
-            opportunities for growth through our innovative technology
-            solutions. Join our partner network to access exclusive resources,
-            dedicated support, and a platform designed to help you succeed.
             </p>
           </div>
+        </div>
 
         {/* Right Column - Login Component */}
         <div className="md:col-span-6 lg:col-span-5 w-full max-w-sm justify-self-center md:justify-self-end">
@@ -91,8 +90,8 @@ export const LoginPage = () => {
               <div className="relative flex items-center justify-center w-16 h-16 rounded-2xl bg-ink-0 border border-ink-200 shadow-sm mb-6 p-2">
                 <img src="/logo.png" alt="Tech4Biz" className="w-full h-full object-contain" />
               </div>
-              <h2 className="text-2xl font-bold text-ink-900 tracking-tight">
+              <h2 className="text-2xl login-form-title font-bold text-ink-900 tracking-tight">
-                Channel Portal
+                Partner Identity Gateway
               </h2>
               <p className="text-ink-500 text-[10px] mt-1.5 font-bold uppercase tracking-wider">
                 Authorized Access Only

Channel-Frontend/src/pages/OnboardingPage.tsx

@@ -401,9 +401,9 @@ export const OnboardingPage: React.FC = () => {
                     <Lock className="w-3.5 h-3.5 text-ink-0" />
                     <span className="text-[10px] font-bold text-ink-0 tracking-widest uppercase">Action Required</span>
                   </div>
-                  <h2 className="text-3xl font-extrabold tracking-tight mb-2">Non-Disclosure Agreement</h2>
+                  <h2 className="text-3xl login-title font-extrabold tracking-tight mb-2">Non-Disclosure Agreement</h2>
-                  <p className="text-sm font-medium text-ink-500">
+                  <p className="text-sm login-desc text-ink-500 mt-1.5 font-medium max-w-md">
-                    Please provide your signature or upload a signed copy of our standard NDA to proceed.
+                    Please review the mutual NDA terms carefully before signing.
                   </p>
                 </div>
 
@@ -431,9 +431,9 @@ export const OnboardingPage: React.FC = () => {
                     <FileText className="w-3.5 h-3.5 text-ink-600" />
                     <span className="text-[10px] font-bold text-ink-700 tracking-widest uppercase">Final Agreement</span>
                   </div>
-                  <h2 className="text-3xl font-extrabold tracking-tight mb-2">Master Services Agreement</h2>
+                  <h2 className="text-3xl login-title font-extrabold tracking-tight mb-2">Master Services Agreement</h2>
-                  <p className="text-sm font-medium text-ink-500">
+                  <p className="text-sm login-desc text-ink-500 mt-1.5 font-medium max-w-md">
-                    Sign the MSA to finalize your compliance requirements and enter the approval queue.
+                    Please review the master services partnership terms before signing.
                   </p>
                 </div>