skip to link text is visible on firefox but not on samsung internet? suggestion on css file also Options

[జిందం వాఐి]

* please find any shortcomings on my css code also
* i have skip link text_ "<span lang="te">దయచేసి జిందం వాఐి ఆలోచనల జాగా మార్పులు గురించి అరుసుకొను</span>"
* its hidden on samsung internet, visible on firefox on android device.
* is this normal?
* My Webpage
* css code

CODE

/* Skip link styling */
.text-assistive {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    box-sizing: border-box;
    position: absolute;
    margin: 0;
    padding: 0;
}
.text-assistive.display-at-top-on-focus {
    top: 0;
    left: 0;
    width: 100%;
}
.text-assistive.display-at-top-on-focus:focus {
    -webkit-clip-path: none;
    clip-path: none;
    z-index: 999;
    height: 80px;
    line-height: 80px;
    background: white;
    font-size: 1.2rem;
    text-decoration: none;
    color: #1295e6;
    text-align: center;
}
#skip-link-target:focus {
    background: #084367;
    color: white;
}
/* end of skip link styling */

/* improved keyboard focus visibility */
a:focus {
    border-bottom-color: #1295e6;
}
.menu-right a:focus, .branding a:focus {
    background-color: white;
    color: #1295e6;
}
/* end of improved keyboard focus visibility */


/* basic styles for the rest of the page */
body {
    font-family: sans-serif;
    font-size: 1.5em;
    font-weight: bold;
    font-style: normal;
    margin: 0;
    padding: 0;
    background-color: #F0F0F0;
    color: #000000;
    line-height: 1.5em;
    letter-spacing: 0.12em;
    word-spacing: 0.16em;
    margin-bottom: 2em;
}
.bg-dark {
    background: #FFDBFF;
    color: #fff;
    min-height: 100px;
}
.content-width {
    box-sizing: border-box;
    max-width: 1208px;
    padding: 1rem;
    margin: 0 auto;
}
a {
    outline-color: transparent;
    text-decoration: none;
    color: #1295e6;
    border-bottom: 4px solid transparent;
    padding: 2px 1px 0;
}
a:hover {
    border-bottom-color: #1295e6;
    border-bottom: 1px solid;
}
.menu-right a, .branding a {
    color: white;
}
.menu-right a:hover, .branding a:hover {
    background-color: white;
    color: #1295e6;
}
.branding {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 220px;
    font-size: 2rem;
    font-style: italic;
    height: 68px;
}
.branding a {
    padding: 0 1rem;
}
.flex-container {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.menu-right {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    height: 68px;
}


.menu-right a {
    display: flex;
    align-items: center;
    padding: 0 1rem;
}


/* end of basic styles for the rest of the page */

/* start old css */

cite {
    font-style: normal;
}

footer {
    padding: 3px;
    background-color: #F6FEF6;
    color: #0d0c0c;
}

a:link {
    color: #3C6D2C;
}

a:visited {
    color: #ff0000;
}

a:active {
    color: #ec00ff;
}

a:focus {
    border-bottom: 1px solid;
}

/* end of old css */