
/* FONT */
.inter {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
}

.oswald {
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
}

/* Font weight utilities */
.fw-200 { font-weight: 200; } /* light */
.fw-300 { font-weight: 300; } /* regular */
.fw-400 { font-weight: 400; } /* regular */
.fw-500 { font-weight: 500; } /* medium */
.fw-600 { font-weight: 600; } /* semibold */
.fw-700 { font-weight: 700; } /* bold */

:root {
  /* Backgrounds */
  --bg-main: #0E0E0E;
  --bg-secondary: #FFFFFF;

  /* Text */
  --text-main: #F5F4F1;
  --text-muted: #0E0E0E;

  /* Accent */
  --accent: rgba(211, 175, 55, 0.75);
  --accent-muted: rgba(255, 255, 255, 0.6);

  /* Border / divider */
  --border-subtle: rgba(193, 156, 80, 0.5)
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    margin: 0;
    background-color: var(--bg-main);
    color: var(--text-main);
    overflow-x: hidden;
}

a {
    text-decoration: none;
}

ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* HEADER */
header.header {
    position: absolute;
    width: 100%;
    display: flex;
    justify-content: center;
    z-index: 1111;
}

.header .header__container {
    width: 100%;
    height: 100%;
    max-width: 1430px;
    display: flex;
    justify-content: end;
    padding: 50px 35px;
}

.header__container .header__menu {
    width: 100%;
    max-width: 828px;
    display: flex;
    justify-content: space-between;
}

section.hero {
    position: relative;
    width: 100%;
    min-height: 100svh;
    max-height: 1080px;

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

    overflow: hidden;
}

.hero__background {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.hero__background img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.header__link,
.footer__link,
.social__link {
  position: relative;
  text-decoration: none;
  color: var(--text-main);

  display: inline-block;
  transform: translate3d(0, 0, 0) scale(1);
  transform-origin: center;

  transition: transform 240ms cubic-bezier(.4,0,.2,1);
  will-change: transform;
}


.header__link,
.footer__link,
.social__link,
.footer__legal a {
  opacity: 0.85;
  transition: transform 240ms cubic-bezier(.4,0,.2,1), opacity 240ms cubic-bezier(.4,0,.2,1);
}

.header__link:hover,
.footer__link:hover, 
.social__link:hover,
.footer__legal a:hover {
    opacity: 1; 
}

/* Burger button */
.header__burger {
    width: 44px;
    height: 44px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 6px;

    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;

    transition: 0.35s ease;
}

.burger__line {
    width: 30px;
    height: 2px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.7);
}

.burger__line:nth-child(2) {
    width: 20px;
}


/* HERO SECTION */

section.hero {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: end;
    align-items: end;
    padding: 0 35px;
}

.hero .hero__container {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 1430px;
    display: flex;
    justify-content: center;
    padding: 0 0 50px 0;
    z-index: 11111;
}

.hero__main__img {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 455px;
    min-height: 500px;
}

.hero__main__img img {
    width: 100%;
    height: 100%;
}

.hero__header {
    position: absolute;
    width: 100%;
    /* max-width: 1000px; */
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    /* gap: 35px; */
    bottom: 50px;
}

.hero__title {
    width: 100%;
    max-width: 1000px;
    font-size: 78px;
    text-transform: uppercase;
    line-height: 100%;
    text-align: left;
}

.hero__subtitle {
    width: 100%;
    display: flex;
    justify-content: end;
}

.hero__subtitle  span {
    display: block;
    width: 100%;
    max-width: 340px;
    font-size: 18px;
    text-align: left;
}

/* ABOUT SECTION */
section.about {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 0 35px;
    margin-top: 150px;
    color: #FFFFFF;
    padding: 0 35px;
}

.about .about__container {
    width: 100%;
    height: 100%;
    max-width: 1430px;
    display: flex;
    justify-content: space-between;
}

.about__title {
    position: relative;
    height: 100%;
    font-size: 58px;
    text-transform: uppercase;
    line-height: 100%;
}

.about__content {
    width: 100%;
    max-width: 850px;
    font-size: 18px;
    line-height: 140%;
    color: #A0A0A0;
}

/* BIOGRAPGY */

section.biography {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 0 35px;
    margin-top: 150px;
}

.biography .biography__container {
    width: 100%;
    height: 100%;
    max-width: 1430px;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.biography__title {
    width: 100%;
    max-width: fit-content;
    position: relative;
    height: 100%;
    font-size: 58px;
    text-transform: uppercase;
    line-height: 100%;
}

.biography__intro__content {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    gap: 25px;
    margin-top: 50px;
    margin-bottom: 50px;
}

.biography__intro__subtitle {
    display: flex;
    flex-direction: column;
    text-transform: uppercase;
    font-size: 34px;
    color: var(--text-main);
}

.intro__subtitle__align__right {
    display: flex;
    justify-content: end;
}

.intro__img {
    width: 100%;
    height: 100%;
    max-height: 400px;
}

.intro__img img {
    width: 100%;
    height: 100%;
    max-height: 400px;
    object-fit: cover;
}

.biography__intro__text {
    width: 100%;
    display: flex;
    font-size: 16px;
    color: #A0A0A0;
    line-height: 140%;
    gap: 130px;
}

.biography__intro__text.is-expanded {
    gap: 35px;
}

.biography__intro__text.is-expanded .biography__intro__center {
    max-width: 530px;
}

.biography__intro__text.is-expanded .biography__intro__right {
    max-width: 370px;
}

.biography__intro__text > div {
    width: 100%;
}

.biography__intro__text .biography__intro__left {
    width: 100%;
    max-width: 425px;
}

.biography__intro__text .biography__intro__center {
    width: 100%;
    max-width: 355px;
    display: flex;
    flex-direction: column;
}

.biography__intro__right {

}

.biography__intro__text a {
    color: var(--text-main);
}

/* Hidden content container */
.biography__more {
  overflow: hidden;
  height: 0;
  opacity: 0;

  transform: translate3d(0, 10px, 0);
  transition:
    height 420ms cubic-bezier(.16, 1, .3, 1),
    opacity 260ms cubic-bezier(.16, 1, .3, 1),
    transform 420ms cubic-bezier(.16, 1, .3, 1);

  will-change: height, opacity, transform;
}

/* When open */
.biography__more.is-open {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* make toggle button behave like link-style button if needed */
.biography__toggle {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

.biography__intro__content .btn {
    font-size: 12px;
    color: #A0A0A0;
}

.biography__intro__content .btn__label {
    margin-right: 10px;
}

.biography__sovereign__content {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 50px;
    margin-bottom: 35px;
    gap: 130px;
}

.biography__sovereign__content:last-child {
    margin-bottom: 0px;
}

.biography__sovereign__img {
    width: 100%;
    height: 220px;
    max-height: 100%;
    max-width: 425px;
}

.biography__sovereign__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center bottom;
}

/* .biography__sovereign__content .sovereign__img {
    width: 530px;
    height: 240px;
    display: flex;
    justify-content: end;
}

.biography__sovereign__content .sovereign__img img {
    width: 265px;
    height: 240px;
    background-color: gray;
} */

.biography__header__sovereign {
    display: flex;
    gap: 65px;
    margin-top: 100px;
}

.sovereign__subheader {
    font-size: 22px;
    text-transform: uppercase;
    margin-bottom: 25px;
}

.sovereign__subcontent {
    width: 100%;
    max-width: 700px;
    font-size: 16px;
    color: #A0A0A0;
    line-height: 140%;
}

.biography__sovereign__text {
    width: 100%;
    /* max-width: 770px; */
    /* max-width: 685px; */
    display: flex;
    flex-direction: column;
    font-size: 16px;
    gap: 15px;
    color: #A0A0A0;
    line-height: 140%;
}

.biography__sovereign__text > div {
    width: 100%;
    /* max-width: 770px; */
    /* max-width: 685px; */
}

/* hide all extra */
.biography__intro__text .more-details {
  display: none;
}

/* show all extra (div + span) */
.biography__intro__text.is-expanded .more-details {
  display: block;
}

/* but keep span inline */
.biography__intro__text.is-expanded span.more-details {
  display: inline;
}

/* OPERATING GEOGRAPHY */

section.operating {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 0 35px;
    margin-top: 150px;
}

.operating__container {
    width: 100%;
    height: 100%;
    max-width: 1430px;
    display: flex;
    justify-content: space-between;
    gap: 130px;
}

.operating__head__title {
    display: flex;
    flex-direction: column;
    gap: 35px;
    width: 100%;
    max-width: 425px;
}

.operating__title__subtitle {
    width: 100%;
    max-width: 320px;
    font-size: 16px;
    color: #A0A0A0;
}

.operating__title {
    width: 100%;
    max-width: fit-content;
    position: relative;
    height: 100%;
    max-height: fit-content;

    font-size: 58px;
    text-transform: uppercase;
    line-height: 100%;
}

.operating__grid {
    width: 100%;
}

.operating__grid__item {
    display: flex;
    align-items: start;
    justify-content: space-between;
    min-height: 80px;
    padding: 25px 0;
    border-bottom: 0.2px solid rgba(255, 255, 255, 0.15);
}

.operating__grid__item:first-child {
    padding-top: 0px;
}

.operating__subtitle {
    width: 100%;
    text-transform: uppercase;
    font-size: 34px;
    line-height: 140%;
}

.operating__description {
    width: 100%;
    max-width: 295px;
    line-height: 140%;
    color: #A0A0A0;
}

/* SPEAKING ENGAGEMENTS */

section.speaking {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 0 35px;
    margin-top: 150px;
    background-color: #FFFFFF;
    color: #0E0E0E;
    padding: 100px 35px;
}

.speaking__container {
    width: 100%;
    height: 100%;
    max-width: 1430px;
    display: flex;
    justify-content: space-between;
    gap: 130px;
}

.speaking__left__block {
    width: 100%;
    max-width: 425px;
    display: flex;
    flex-direction: column;
    gap: 35px;
}

.speaking__title {
    width: 100%;
    max-width: fit-content;
    position: relative;
    font-size: 58px;
    text-transform: uppercase;
    line-height: 100%;
}

.speaking__subtitle {
    display: flex;
    justify-content: end;
    width: 100%;
    font-size: 16px;
    color: #313131;
}

.speaking__subtitle span {
    display: block;
    width: 100%;
    max-width: 300px;
    font-size: 16px;
}

.speaking__main__text {
    width: 100%;
    font-size: 16px;
    color: #313131;
}

.speaking__right__block {
    position: relative;
}

.speaking__right__block .btn {
  position: absolute;
  bottom: -10px;

  color: #0E0E0E;
  font-size: 16px;
  padding: 0 15px 15px 0;

  text-decoration: none;
  display: inline-block;

  transform: translate3d(0, 0, 0);
  transition:
    transform 220ms cubic-bezier(.4,0,.2,1),
    color 220ms cubic-bezier(.4,0,.2,1);

  will-change: transform;
}

.speaking__right__block .btn__label {
    margin-right: 15px;
}


.speaking__right__block .btn::after {
  content: "";
  position: absolute;
  left: 0;
  right: 15px;
  bottom: 6px;

  height: 1px;
  background-color: #00000085;

  transform: scaleX(0);
  transform-origin: left;
  transition: transform 320ms cubic-bezier(.4,0,.2,1);
}

.speaking__right__block .btn:hover {
  transform: translate3d(0, -1px, 0);
}

.speaking__right__block .btn:hover::after {
  transform: scaleX(1);
}

.speaking__right__block .btn .arrow {
  display: inline-flex;
  transform: translate3d(0, 0, 0);
  transition: transform 220ms cubic-bezier(.4,0,.2,1);
  will-change: transform;
}

.speaking__right__block .btn:hover .arrow {
  transform: translate3d(4px, 0, 0);
}

.speaking__right__block .btn .arrow {
  transition-delay: 60ms;
}

.topics__content {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 130px;
    margin-top: 150px;
}

.topics__img {
    width: 100%;
    max-width: 425px;
    height: 300px;
}

.topics__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.topics__grid {
    width: 100%;
    /* max-width: 690px; */
    height: 100%;
    display: flex;
    flex-wrap: wrap;
}

.topics__grid__item {
    width: 100%;
    max-width: 275px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    font-size: 16px;
    padding: 35px;
    border-right: 0.5px solid rgb(14 14 14 / 10%);
    border-bottom: 0.5px solid rgb(14 14 14 / 10%);
}

.topic__subtitle {
    text-transform: uppercase;
    color: #0E0E0E;
}

.topic__index {
    text-align: right;
    color: #0E0E0E;
}

.topics__grid__item.item__03,
.topics__grid__item.item__06 {
    border-right: none;
}

.topics__grid__item.item__04,
.topics__grid__item.item__05,
.topics__grid__item.item__06 {
    border-bottom: none;
}


section.contact {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 0 35px;
    margin-top: 150px;
}

.contact__container {
    width: 100%;
    height: 100%;
    max-width: 1430px;
    display: flex;
    justify-content: space-between;
    gap: 130px;
}

.contact__left__block {
    width: 100%;
    max-width: 425px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.contact__title {
    width: 100%;
    max-width: fit-content;
    position: relative;
    font-size: 58px;
    text-transform: uppercase;
    line-height: 100%;
}

.contact__subtitle {
    font-size: 22px;
    text-transform: uppercase;
    margin: 50px 0 10px 0;
}

.contact__subtext {
    font-size: 16px;
    color: #A0A0A0;
    width: 100%;
    max-width: 350px;
}

.contact__form {
    width: 100%;
    gap: 20px;
    display: flex;
    flex-direction: column;
}

.contact-form__field {
    position: relative;
    padding: 25px 15px 15px 15px;
    border-bottom: 0.5px solid rgba(156, 156, 156, 0.16);
}

.contact-form__field:first-child {
    padding-top: 5px;
}

.contact__form.one__field {
    width: 100%;
    display: flex;
    gap: 10px;
}

.contact__form.one__field .contact-form__field {
    width: 50%;
}

.contact-form__input,
.contact-form__textarea {
    width: 100%;
    background: transparent;
    border: 0;
    outline: none;

    color: var(--text-main);
    font-weight: 300;
    font-family: "Inter", sans-serif;

    font-size: 14px;
    line-height: 1.25;

    padding-right: 56px;
}

.contact-form__input::placeholder,
.contact-form__textarea::placeholder {
    color: rgba(255, 255, 255, 0.3);
    font-weight: 200;
    font-size: 14px;
    font-family: "Inter", sans-serif;
}

.contact-form__textarea {
    resize: vertical;
    min-height: 50px;
}

.contact-form__subtext {
    font-size: 12px;
    text-align: right;
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.5);
}

.contact__actions {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.contact__actions a {
    color: var(--text-main);
    padding: 12px 70px;
    background-color: #37373763;
    margin-top: 35px;
    border: 0.3px solid #37373766;

    display: inline-block;
    text-decoration: none;

    transform: translate3d(0, 0, 0) scale(1);
    transition:
        transform 220ms cubic-bezier(.4,0,.2,1),
        background-color 220ms cubic-bezier(.4,0,.2,1),
        box-shadow 220ms cubic-bezier(.4,0,.2,1);

    will-change: transform;
}

/* hover */
.contact__actions a:hover {
  transform: translate3d(0, -1px, 0) scale(1.03);
  background-color: gba(211, 175, 55, 1);
}

footer {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 0 35px;
    margin-top: 150px;
}

.footer__container {
    width: 100%;
    height: 100%;
    max-width: 1430px;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.footer__upper {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 35px;
}

.footer__upper__content {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.footer__menu {
    width: 100%;
    max-width: 650px;
    display: flex;
    justify-content: space-between;
}

.footer__menu li a,
.footer__social li a {
    color: var(--text-main);
    font-size: 14px;
}

.footer__social li a {
    text-decoration: underline;
}

.footer__details {
    color: var(--text-main);
    font-size: 14px;
}

.footer__bottom {
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding-top: 25px;
    padding-bottom: 25px;
    margin-top: 25px;
    color: var(--text-main);
    border-top: 0.3px solid #ffffff12;
}

.footer__bottom span {
    font-size: 12px;
}

.footer__bottom .footer__legal {
    width: 12%;
    display: flex;
    justify-content: space-between;
}

.footer__bottom a {
    text-decoration: none;
    color: var(--text-main);
    font-size: 12px;
    transition: transform 520ms cubic-bezier(.2, .8, .2, 1)
}


@media (max-width: 768px) {
    .header__burger {
        display: flex;
    }

    .header {
        padding: 0 35px;
    }

    .header .header__container {
        justify-content: end;
        padding: 35px 0;
    }

    .hero .hero__container {
        padding: 0;
    }

    .hero .hero__container .hero__header {
        gap: 25px;
        bottom: 300px;
    }

    .hero .hero__title {
        font-size: 60px;
    }

    .hero__background img {
        object-fit: contain;
        height: 160%;
    }

    .hero .hero__subtitle,
    .biography .biography__intro__text,
    .sovereign__subcontent,
    .biography__sovereign__text,
    .speaking__subtitle,
    .speaking__right__block,
    .contact__subtext {
        font-size: 18px;
    }

    section.about {
        margin-top: 100px;
    }

    .about .about__container {
        flex-direction: column;
        gap: 35px;
    }

    .about .about__title,
    .biography .biography__title, 
    .operating .operating__title, 
    .speaking .speaking__title,
    .contact .contact__title {
        font-size: 44px;
    }

    .about .about__content {
        font-size: 18px;
    }

    section.biography {
        margin-top: 100px;
    }

    .biography__intro__content,
    .biography__sovereign__content {
        flex-direction: column;
        margin-top: 35px;
        gap: 20px;
    }

    .intro__img,
    .sovereign__img {
        max-width: 305px;
    }

    .biography__sovereign__content .sovereign__img {
        justify-content: start;
    }

    .biography__intro__content {
        margin-bottom: 35px;
    }

    .biography__intro__content .btn {
        font-size: 18px;
    }

    .biography__sovereign__text {
        gap: 35px;
    }

    .biography__intro__subtitle {
        font-size: 25px;
        margin-top: 35px;
    }

    .intro__subtitle__align__right {
        text-align: right;
    }

    .intro__subtitle__align__left {
        text-align: left;
    }

    .biography__intro__text {
        flex-direction: column;
        gap: 35px;
    }

    .biography__header__sovereign {
        flex-direction: column;
        gap: 35px;
    }

    .sovereign__subheader {
        margin-bottom: 0px;
    }

    section.operating {
        margin-top: 100px;
    }

    .operating .operating__grid {
        margin-top: 35px;
    }

    .operating .operating__grid__item.unfilled {
        display: none;
    }

    .operating__container {
        flex-direction: column;
        gap: 35px;
    }

    section.speaking {
        margin-top: 100px;
    }

    .speaking .speaking__container {
        flex-direction: column;
    }

    .speaking .speaking__right__block .btn {
        font-size: 18px;
        bottom: -65px;
    }

    .speaking__container {
        gap: 35px;
    }

    .speaking__subtitle {
        justify-content: start;
    }

    .topics__content .topics__img {
        display: none;
    }

    .topics__content {
        margin-top: 100px;
    }

    .topics__grid .topics__grid__item {
        max-width: 100%;
        border-bottom: 0.5px solid rgba(14, 14, 14, 0.18);
        border-right: none;
    }

    section.contact {
        margin-top: 100px;
    }

    .contact .contact__container {
        flex-direction: column;
        gap: 35px;
    }

    .contact .contact__form {
        margin-top: 35px;
    }

    footer .footer__menu {
        flex-direction: column;
        gap: 10px;
    }

    footer .footer__menu a,
    footer .footer__social a {
        font-size: 16px;
    }

    footer .footer__social {
        margin-top: 20px;
    }

    footer .footer__upper__content {
        flex-direction: column;
    }

    footer .footer__bottom {
        flex-direction: column;
    }

    footer .footer__details {
        font-size: 16px;
    }

    footer .footer__bottom {
        gap: 10px;
    }

    footer .footer__bottom span {
        font-size: 16px;
    }

    footer .footer__bottom .footer__legal {
        width: 100%;
        gap: 10px;
    }

    footer .footer__legal a {
        font-size: 16px;
    }
}


/* ===== Page load: Hero ===== */
.hero__main__img,
.hero__header {
  opacity: 0;
  transform: translate3d(0, 14px, 0);
  transition: opacity 700ms cubic-bezier(.2,.8,.2,1), transform 700ms cubic-bezier(.2,.8,.2,1);
  will-change: opacity, transform;
}

body.page-ready .hero__main__img {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  transition-delay: 80ms;
}

body.page-ready .hero__header {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  transition-delay: 170ms;
}

/* ===== Scroll reveal base ===== */
/* ===== Scroll reveal (more noticeable, still premium) ===== */
/* ===== Scroll reveal (noticeable, premium) ===== */
[data-reveal] {
  --reveal-x: 0px;
  --reveal-y: 34px;
  --reveal-scale: 0.985;
  --hover-scale: 1;

  opacity: 0;
  filter: blur(10px);

  transform:
    translate3d(var(--reveal-x), var(--reveal-y), 0)
    scale(calc(var(--reveal-scale) * var(--hover-scale)));

  transition:
    opacity 900ms cubic-bezier(.16, 1, .3, 1),
    transform 900ms cubic-bezier(.16, 1, .3, 1),
    filter 900ms cubic-bezier(.16, 1, .3, 1);

  will-change: opacity, transform, filter;
}

[data-reveal].is-visible {
  opacity: 1;
  filter: blur(0);
  --reveal-x: 0px;
  --reveal-y: 0px;
  --reveal-scale: 1;
}

/* Directions */
[data-reveal="left"]  { --reveal-x: -46px; --reveal-y: 22px; }
[data-reveal="right"] { --reveal-x:  46px; --reveal-y: 22px; }
[data-reveal="up"]    { --reveal-x:   0px; --reveal-y: 38px; }


/* ===== Biography stagger (nice pacing) ===== */
.biography__title { transition-delay: 0ms; }
.biography__intro__content .intro__img { transition-delay: 90ms; }
.biography__intro__content .biography__intro__text { transition-delay: 170ms; }
.biography__sovereign__content:nth-of-type(1) { transition-delay: 120ms; }
.biography__sovereign__content:nth-of-type(2) { transition-delay: 200ms; }

/* Better typography spacing inside intro text */
.biography__intro__text p {
  margin: 0;
}

.biography__intro__text p + p {
  margin-top: 16px;
}

.biography__intro__text .btn {
  margin-top: 15px;
  display: inline-flex;
}


.operating__grid__item[data-reveal] {
  transition-duration: 900ms, 180ms, 900ms;
}

[data-reveal].is-visible {
  transition-delay: 0ms !important;
}

[data-reveal][data-delay] {
  transition-delay: 0ms; /* default, will be overridden inline via JS below */
}


.btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--text-main);

  transform: translate3d(0, 0, 0);
  transition: transform 240ms cubic-bezier(.4,0,.2,1);
  will-change: transform;
}

/* Label underline */
.btn__label {
  position: relative;
  display: inline-block;
}

.biography .btn__label::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 100%;
  height: 0.2px;
  background-color: #ffffff2e;

  transform: scaleX(0);
  transform-origin: left;
  transition: transform 260ms cubic-bezier(.4,0,.2,1);
}

/* Hover */
.biography .btn:hover {
  transform: translate3d(0, -1px, 0);
}

.biography .btn:hover .btn__label::after {
  transform: scaleX(1);
}
