@font-face {font-family: "Didot W02 Roman";
  src: url("/public/assets/fonts/DidotW02/3559a954a6ec32a55712a9b0427af0b8.eot"); /* IE9*/
  src: url("/public/assets/fonts/DidotW02/3559a954a6ec32a55712a9b0427af0b8.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("/public/assets/fonts/DidotW02/3559a954a6ec32a55712a9b0427af0b8.woff2") format("woff2"), /* chrome、firefox */
  url("/public/assets/fonts/DidotW02/3559a954a6ec32a55712a9b0427af0b8.woff") format("woff"), /* chrome、firefox */
  url("/public/assets/fonts/DidotW02/3559a954a6ec32a55712a9b0427af0b8.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("/public/assets/fonts/DidotW02/3559a954a6ec32a55712a9b0427af0b8.svg#Didot W02 Roman") format("svg"); /* iOS 4.1- */
}


@font-face {
    font-display: swap;
    font-family: "CeraPro-Regular";
    font-weight: 400;
    src:url(/public/assets/fonts/cerapro-regular/font.woff2) format("woff2"),
        url(/public/assets/fonts/cerapro-regular/font.woff) format("woff")
}
@font-face {
    font-display: swap;
    font-family: "CeraPro-Bold";
    font-weight: 400;
    src:url(/public/assets/fonts/cerapro-bold/font.woff2) format("woff2"),
        url(/public/assets/fonts/cerapro-bold/font.woff) format("woff")
}

@font-face {
    font-display: swap;
    font-family: "PF Marlet Finesse";
    src:url(/public/assets/fonts/pf-marlet-finesse/PFMarletFinesse-LightItalic.woff2) format("woff2"),
        url(/public/assets/fonts/pf-marlet-finesse/PFMarletFinesse-LightItalic.woff) format("woff")
}

@font-face {
    font-family: "Ivy-Presto-Headline-Light";
    src: url("/public/assets/fonts/Ivy-Presto/Ivy-Presto-Display-Light.otf") format("opentype");
    font-style: italic;
    font-weight: 300;
}

body {
  touch-action: pan-x pan-y; /* allow scrolling, block pinch */
  user-select: none; /* prevent text selection */
}
img, a {
    -webkit-user-drag: none;
    user-select: none;
}
/*
body {
  animation: fadeIn 0.1s ease-in;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
*/
#pageFade {
  position: fixed;
  inset: 0;               /* covers entire viewport */
  background: white;      /* match your page background */
  pointer-events: none;   /* doesn’t block clicks */
  opacity: 1;
  transition: opacity 0.15s ease;
  z-index: 9999;
}

#pageFade.hidden {
  opacity: 0;
}


.mx-cust-10 {
    margin-right: 6.25rem!important;
    margin-left: 6.25rem!important
}


.vertical-divider {
    border-right: 1px solid #0099a9;
}
.vertical-divider-thick {
    border-right: 2px solid #0099a9;
}
.horizontal-divider-top {
    border-top: 1px solid #0099a9;
    height: 1px;
}

.horizontal-divider {
    border-bottom: 1px solid #0099a9;
    height: 1px;
}
.awards_item_img {
    max-height: 300px;
    max-width: 300px;
    width: auto;
}
.card-fixed-height-100px {
    height: 100px; 
} 

.card-fixed-height-200px {
    height: 200px;
}
.card-fixed-height-250px {
    height: 250px;
}

.card-fixed-height-300px {
    height: 300px;
}

.card-fixed-height-400px {
    height: 400px;
}

.card-fixed-height-500px {
    height: 500px;
}

.card-title-text-lg {
    font-family: "Ivy-Presto-Headline-Light";
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.4;
    color: #3d4543;
}

.card-title-text {
    font-family: "Ivy-Presto-Headline-Light";
    font-size: 2.5rem;
    font-weight: 400;
    line-height: 1.2;
    color: #3d4543;
}

.card-body-text {
    font-family: "CeraPro-Regular" !important;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}

.modal-sustain-headline {
    font-family: "CeraPro-Regular" !important;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}
.modal-sustain-title-xl {
    font-family: "Ivy-Presto-Headline-Light" !important;
    font-size: 4rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}

.modal-sustain-title-lg {
    font-family: "Ivy-Presto-Headline-Light" !important;
    font-size: 3.5rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}

.modal-sustain-title {
    font-family: "Ivy-Presto-Headline-Light" !important;
    font-size: 3rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}
.modal-sustain-title-xs {
    font-family: "Ivy-Presto-Headline-Light" !important;
    font-size: 2.0rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}
.modal-sustain-title-sm {
    font-family: "Ivy-Presto-Headline-Light" !important;
    font-size: 2.5rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}
.modal-sustain-text {
    font-family: "CeraPro-Regular" !important;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.2;
    color: #3d4543;
}

.modal-bio-landscape-headline {
    font-family: "CeraPro-Regular" !important;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}
.modal-bio-landscape-title {
    font-family: "Ivy-Presto-Headline-Light" !important;
    font-size: 3rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}
.modal-bio-landscape-title-sm {
    font-family: "Ivy-Presto-Headline-Light" !important;
    font-size: 2.5rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}

.modal-bio-landscape-text {
    font-family: "CeraPro-Regular" !important;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.2;
    color: #3d4543;
}

.home-title {
    font-family: "Ivy-Presto-Headline-Light" !important;
    /* font-size: 4.7rem; */
    font-size: clamp(12px, 5vw, 4.5rem); 
    font-weight: 400;
    line-height: 1.5;
    color: #3d4543;
}

.modal-overlay-text {
    background-color: rgba(255, 255, 255, 0.85); /* black with 50% opacity */
    padding: 40px;
    width: 50%;
    max-width: 50%;
}

.modal-overlay-text-40 {
    background-color: rgba(255, 255, 255, 0.75); /* black with 50% opacity */
    padding: 20px;
    width: 40%;
    max-width: 40%;
}

.modal-dot {
    color:#0099a9;
}

.modal-side-close {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1060;

    width: 100px;          /* large touch area */
    height: 100px;

    background: #0099a9;
    border: 6px solid #ffffff;
    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;
    touch-action: manipulation;

    box-shadow: 0 10px 25px rgba(0,0,0,0.3)
}
.modal-side-close:active{
    transform: translateY(-50%) scale(0.9);
}
/* control icon size */
.modal-side-close img{
    width: 55px;
    height: auto;
    pointer-events: none;   /* whole circle clickable */
}

.item-image-award-25 {
    width: 160px;
    height: auto;           /* preserves aspect ratio */
    display: block;
    margin-left: auto;
    margin-right: auto;    /* center the image in the column */
    cursor: pointer;
    filter: grayscale(100%);   /* make grayscale */
    cursor: pointer;
    transition: filter 0.2s ease; /* smooth transition when clicked */
}
.item-image-award-25.selected {
    filter: none;              /* remove grayscale when selected */
}

.item-image-award-24 {
    width: 160px;
    height: auto;           /* preserves aspect ratio */
    display: block;
    margin-left: auto;
    margin-right: auto;    /* center the image in the column */
    cursor: pointer;
    filter: grayscale(100%);   /* make grayscale */
    cursor: pointer;
    transition: filter 0.2s ease; /* smooth transition when clicked */
}
.item-image-award-24.selected {
    filter: none;              /* remove grayscale when selected */
}

.item-image-award-23 {
    width: 160px;
    height: auto;           /* preserves aspect ratio */
    display: block;
    margin-left: auto;
    margin-right: auto;    /* center the image in the column */
    cursor: pointer;
    filter: grayscale(100%);   /* make grayscale */
    cursor: pointer;
    transition: filter 0.2s ease; /* smooth transition when clicked */
}
.item-image-award-23.selected {
    filter: none;              /* remove grayscale when selected */
}

.item-image-award-22 {
    width: 160px;
    height: auto;           /* preserves aspect ratio */
    display: block;
    margin-left: auto;
    margin-right: auto;    /* center the image in the column */
    cursor: pointer;
    filter: grayscale(100%);    /* make grayscale */
    cursor: pointer;
    transition: filter 0.2s ease; /* smooth transition when clicked */
}
.item-image-award-22.selected {
    filter: none;                 /* remove grayscale when selected */
    transition: filter 0.2s ease; /* smooth transition when clicked */
}

.item-image-award-21 {
    width: 160px;
    height: auto;           /* preserves aspect ratio */
    display: block;
    margin-left: auto;
    margin-right: auto;    /* center the image in the column */
    cursor: pointer;
    filter: grayscale(100%);    /* make grayscale */
    border-radius: 12px;   /* this controls the rounded shadow */
    cursor: pointer;
    transition: filter 0.2s ease; /* smooth transition when clicked */
}
.item-image-award-21.selected {
    filter: none;              /* remove grayscale when selected */
    transition: filter 0.2s ease; /* smooth transition when clicked */
}
.item-image-award-20 {
    width: 160px;
    height: auto;           /* preserves aspect ratio */
    display: block;
    margin-left: auto;
    margin-right: auto;    /* center the image in the column */
    cursor: pointer;
    filter: grayscale(100%);    /* make grayscale */
    cursor: pointer;
    transition: filter 0.2s ease; /* smooth transition when clicked */
}
.item-image-award-20.selected {
    filter: none;              /* remove grayscale when selected */
    transition: filter 0.2s ease; /* smooth transition when clicked */
}

/* Pulse animation */
@keyframes pulseGlow {
    0% {
        box-shadow: 0 0 0 0 rgba(13,110,253,0.7);
    }

    70% {
        box-shadow: 0 0 0 12px rgba(13,110,253,0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(13,110,253,0);
    }
}

.btn-neptune {
    background-color: #0099a9;
    color:white;
    font-family: "CeraPro-Regular";
    font-size: 19px;
}

.btn-lang-neptune {
    background-color: #0099a9;
    color: white; 
    font-family: "CeraPro-Regular";
    font-size: 40px;
}

.dropdown-menu-neptune {
    background-color: #0099a9;
}