From f637dcba6b96bfccc4c1ab5637901270fc9edece Mon Sep 17 00:00:00 2001
From: zojgame <zogame002@gmail.com>
Date: Mon, 22 Apr 2024 14:00:45 +0500
Subject: [PATCH] text indent flexible

---
 src/index.css         | 7 ++++---
 src/pages/Company.tsx | 4 ++--
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/index.css b/src/index.css
index 8ea5a17..00313b6 100644
--- a/src/index.css
+++ b/src/index.css
@@ -18,7 +18,6 @@ body {
   .text-caption-s {
     font-family: "Usual", sans-serif;
     line-height: 135%;
-    /* clamp(10px, 0.6774rem + 0.3226vi, 12px); */
   }
 
   .text-caption-m {
@@ -48,13 +47,11 @@ body {
   .text-subheadline-m {
     font-family: "Usual", sans-serif;
     line-height: 135%;
-    /* clamp(20px, 0.6774rem + 0.3226vi, 28px); */
   }
 
   .text-subheadline-l {
     font-family: "Usual", sans-serif;
     line-height: 135%;
-    /* clamp(32px, 0.6774rem + 0.3226vi, 48px); */
   }
 
   .text-headline-s {
@@ -63,4 +60,8 @@ body {
     letter-spacing: -0.03em;
     font-size: clamp(44px, -0.257rem + 3.7559vw, 68px);
   }
+
+  .rubber-headline-indent {
+    text-indent: clamp(209px, -0.4197rem + 16.8396vw, 842px);
+  }
 }
diff --git a/src/pages/Company.tsx b/src/pages/Company.tsx
index fd643bb..c4e27fe 100644
--- a/src/pages/Company.tsx
+++ b/src/pages/Company.tsx
@@ -6,12 +6,12 @@ const Company = () => {
   return (
     <section className={`xl:py-16 py-10 font-usual ${isMobile ? "pt-24" : ""}`}>
       {/* <h1 className="uppercase font-mixcase xl:text-[56px] sm:text-[40px] xl:leading-[56px] sm:leading-[40px] text-[28px] leading-[28px] xl:indent-[261px] xl:pb-16 pb-10 xl:px-6 px-4"> */}
-      <h1 className="uppercase text-headline-s xl:indent-[261px] xl:pb-16 pb-10 xl:px-6 px-4">
+      <h1 className="uppercase xl:rubber-headline-indent text-headline-s xl:pb-16 pb-10 xl:px-6 px-4">
         IRTH is a privately held real estate investment platform part of a large
         local family conglomerate from Dubai
       </h1>
       <OurStory />
-      <h1 className="uppercase text-headline-s xl:indent-[261px] xl:pb-16 pb-10 xl:px-6 px-4">
+      <h1 className="uppercase text-headline-s xl:rubber-headline-indent xl:pb-16 pb-10 xl:px-6 px-4">
         IRTHS’s real estate portfolio is spread across numerous projects, below
         is a snapshot of some of our current and previous investments
       </h1>