html {
    scroll-behavior: smooth;
}

a {
    text-decoration: none;
}

/* ==== Font ===== */
@font-face {
    font-family: "PSL SimilanyaExtra Pro";
    src: url("../font/PSL150pro.ttf") format("truetype");
    font-weight: 500;
    /* normal */
    font-style: normal;
}

.font-PSLSimilanyaExtraPro {
    font-family: "PSL SimilanyaExtra Pro", sans-serif;
}

@font-face {
    font-family: "Avigea";
    src: url("../font/Avigea.ttf") format("truetype");
    font-weight: 500;
    /* normal */
    font-style: normal;
}

.font-Avigea {
    font-family: "Avigea", sans-serif;
}

@font-face {
    font-family: "LINESeedSansTH";
    src: url("../font/LINESeedSansTH_A_Th.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "LINESeedSansTH";
    src: url("../font/LINESeedSansTH_A_Rg.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "LINESeedSansTH";
    src: url("../font/LINESeedSansTH_A_Bd.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: "LINESeedSansTH";
    src: url("../font/LINESeedSansTH_A_XBd.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "LINESeedSansTH";
    src: url("../font/LINESeedSansTH_A_He.ttf") format("truetype");
    font-weight: 800;
    font-style: normal;
}

.font-LINESeedSansTH {
    font-family: "LINESeedSansTH", sans-serif;
}


:root {
    --fs-h1: 60px;
    --fs-h2: 50px;
    --fs-h3: 42px;
    --fs-h4: 34px;
    --fs-h5: 28px;
    --fs-h6: 20px;
    --fs-p: 16px;
    --fs-small: 14px;
}

@media (max-width: 991px) {
    :root {
        --fs-h1: clamp(50px, 6vw, 60px);
        --fs-h2: clamp(40px, 5vw, 50px);
        --fs-h3: clamp(30px, 4.5vw, 42px);
        --fs-h4: clamp(25px, 4vw, 34px);
        --fs-h5: clamp(18px, 3.5vw, 28px);
        --fs-h6: clamp(16px, 3vw, 20px);

        --fs-p: clamp(14px, 2.2vw, 16px);
        --fs-small: clamp(12px, 2vw, 14px);
    }
}

html,
body {
    overflow-x: hidden !important;
}

body {
    position: relative;
    font-family: "PSL SimilanyaExtra Pro", sans-serif;
    color: #000;

    width: 100%;
    min-height: 100dvh;
}

/* ==== font ==== */

h1,
.h1 {
    font-size: var(--fs-h1);
}

h2,
.h2 {
    font-size: var(--fs-h2);
}

h3,
.h3 {
    font-size: var(--fs-h3);
}

h4,
.h4 {
    font-size: var(--fs-h4);
}

h5,
.h5 {
    font-size: var(--fs-h5);
}

h6,
.h6 {
    font-size: var(--fs-h6);
    line-height: 22px;
}

p,
.p {
    font-size: var(--fs-p);
}

small,
.small {
    font-size: var(--fs-small);
}

/* ===== Custom Scrollbar - Tales of Issgard Theme (Fixed) ===== */
html,
body {
    background-color: #0a1a3a;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg,
            rgba(180, 210, 255, 0.6) 0%,
            rgba(120, 160, 220, 0.7) 50%,
            rgba(80, 110, 180, 0.6) 100%);
    border-radius: 10px;
    box-shadow: 0 0 6px rgba(150, 200, 255, 0.4);
    transition: background 0.3s ease;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg,
            rgba(210, 230, 255, 0.85) 0%,
            rgba(150, 190, 240, 0.9) 50%,
            rgba(110, 140, 210, 0.85) 100%);
    box-shadow: 0 0 10px rgba(180, 220, 255, 0.7);
}

::-webkit-scrollbar-corner {
    background: transparent;
}

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(140, 180, 230, 0.6) transparent;
}

.contentMain {
    position: relative;
    width: 100%;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}