/* ========================================
   0. Fonts & CSS Variables
   ======================================== */
/* Импорт Montserrat (ExtraLight 200, Light 300, Regular 400, Semi‑Bold 600)
   и Schibsted Grotesk (Regular 400, Semi‑Bold 600, Bold 700) */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;600&family=Schibsted+Grotesk:wght@400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;600&family=Schibsted+Grotesk:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Vujahday+Script&display=swap');



:root {
  --clr-bg: #0B0B0B;
  --clr-white: #FFFFFF;
  --clr-primary: #B50DDA;
  --clr-glow: rgba(181, 13, 218, 0.56);

}

html {
  scroll-behavior: smooth;
}

/* ========================================
   1. Reset & Base Styles
   ======================================== */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html, body {
  height: 100%;
}
body {
  background: var(--clr-bg);
  color: var(--clr-white);
  font-family: 'Montserrat', sans-serif;
  line-height: 1.5;
}

/* ========================================
   2. Links & Lists
   ======================================== */
a {
  text-decoration: none;
  color: inherit;
}
ul {
  list-style: none;
}

/* ========================================
   3. Hero Section
   ======================================== */
.hero {
  position: relative;
  width: 100%;
  height: 832px;
  background: var(--clr-bg);
  overflow: visible;
}

/* — Purple background rectangle */
.hero__bg-rect {
  position: absolute;
  top: 313px;
  left: 122px;
  width: 751px;
  height: 428px;
  background: var(--clr-primary);
  box-shadow: 0 0 26.8px 25px var(--clr-primary);
  z-index: 1;
}

/* — SEE text */
.hero__see {
  position: absolute;
  top: 520px;
  left: 27px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 700;       /* Bold */
  font-size: 120px;
  z-index: 1;
}

/* — EE outline */
.hero__ee {
  position: absolute;
  top: 520px;
  left: 109px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 700;       /* Bold */
  font-size: 121px;
  color: transparent;
  -webkit-text-stroke: 1px #0B0B0B;
  z-index: 2;
}

/* — WITH text */
.hero__with {
  position: absolute;
  top: 520px;
  left: 955px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 700;       /* Regular */
  font-size: 121px;
  z-index: 2;
}

/* — OWL‑EYES text */
.hero__owleyes {
  position: absolute;
  top: 650px;
  left: 650px;
  display: flex;
  z-index: 3;
}
.owleyes__owl {
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 600;
  font-size: 120px;
  color: var(--clr-bg);
}
.owleyes__eyes {
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 600;
  font-size: 120px;
  color: var(--clr-primary);
}

/* — Owl image */
.hero__owl {
  position: absolute;
  top: -30px;
  left: 63.86px;
  width: 1100.29px;
  height: 826px;
  object-fit: cover;
  z-index: 2;
}

/* ========================================
   4. Header
   ======================================== */
.hero__header {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 131px;
  padding: 15px 50px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  z-index: 4;
}
.hero__logo img {
  width: 113px;
  height: 53px;
}
.hero__group {
  display: flex;
  gap: 141px;
}
.hero__nav ul {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.hero__nav a {
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 1;
  color: var(--clr-white);
}
.hero__icons {
  display: flex;
  gap: 9px;
}
.hero__icons img {
  width: 23px;
  height: 23px;
}

/* ========================================
   5. Right‑side Info Block
   ======================================== */
.hero__info {
  position: absolute;
  top: 225px;
  left: 926px;        /* ваше текущее смещение */
  width: 373px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  z-index: 3;
}

/* заголовок разбиваем на две строки */
.hero__info-title {
  position: relative;
  margin: 0;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-size: 40px;
  font-weight: 400;      /* Regular */
  line-height: 1.15;
  text-align: left;
}

/* первая строка */
.hero__info-title > .info-earn {
  display: block;
}

/* вторая строка — отступ влево и белый цвет */
.hero__info-title > .info-rev {
  display: block;
  margin-left: 152px;    /* сдвиг вправо относительно первой строки */
  color: var(--clr-white);
}

/* абзац под заголовком */
.hero__info-text {
  font-family: 'Montserrat', sans-serif;
  font-weight: 200;      /* ExtraLight */
  font-size: 16px;
  line-height: 1.5;
  text-align: left;
}

/* ========================================
   6. Button (base + hover‑glow)
   ======================================== */
/* контейнер для кнопки */
.btn-wrap {
  position: relative;
  display: inline-block;
  width: 100%;
}

/* само свечение — псевдоэлемент на контейнере */
.btn-wrap::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--clr-primary);
  filter: blur(32.8px);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 1;
  pointer-events: none;
}

/* при наведении контейнера — включаем свечение */
.btn-wrap:hover::before {
  opacity: 1;
}

/* ваша кнопка остаётся внутри, с нужным clip-path */
.hero__info-btn {
  position: relative;
  z-index: 2;               /* поверх свечения */
  width: 100%;
  height: 43px;
  background: var(--clr-primary);
  color: var(--clr-bg);
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 600;
  font-size: 23px;
  text-transform: uppercase;
  text-align: center;
  line-height: 43px;
  border: none;
  cursor: pointer;
  
  /* срезаем нижний‑левый и верхний‑правый углы */
  clip-path: polygon(
    0   0,
    calc(100% - 16px) 0,
    100% 16px,
    100% 100%,
    16px 100%,
    0   calc(100% - 16px)
  );
}




/* ========================================
   7. Bottom “рваный” край
   ======================================== */
.hero__texture {
  position: absolute;
  bottom: -19px;
  left: 0;         /* прижимаем к левому краю */
  width: 100%;     /* растягиваем на всю ширину секции */
  height: 103px;
  object-fit: cover;
  z-index: 5;
  pointer-events: none;
}


/* ========================================
   About‑Us Section: Background & Owl
   ======================================== */
.about {
  position: relative;
  overflow: visible;
  width: 100%;
  height: 832px;  
  /* базовый полупрозрачный фон + картинка бекграунда */
  background-color: rgba(11, 11, 11, 0.98);
  background-image: url('../assets/png/background_aboutus.png');
  background-repeat: no-repeat;
  background-position: -200px -200px;
  background-size: 1665px 1500px;
  overflow: hidden;
}

.about__owl {
  position: absolute;
  top: 234px;
  left: -5px;
  width: 994px;
  height: 558px;
  background-image: url('../assets/png/owl_aboutus.png');
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 1;
}
/* ========================================
   About‑Us Heading: двойной “ABOUT”
   ======================================== */
/* контейнер заголовка */
.about__heading {
  position: absolute;
  top: 0;
  left: 0;
  width: 367px;
  height: 125px;
}

.about__title-outline {
  position: absolute;
  top: 48px;
  left: 66px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-size: 101px;
  font-weight: 700;
  line-height: 1;
  
  /* убираем глобальный blur, оставляем только направленную тень */
  filter: none;
  color: transparent;
  -webkit-text-stroke: 1px var(--clr-primary);

  /* смещение по Y (4px) + размытие (3.9px) — тень пойдёт вниз */
  text-shadow:
    0 4px 3.9px var(--clr-primary),
    0 8px 7px rgba(181, 13, 218, 0.2);

  /* (опционально) дополнительный более мягкий слой тени для глубины */
  /* text-shadow: 
       0 4px 3.9px var(--clr-primary),
       0 8px 7px rgba(181,13,218,0.2); */

  z-index: 1;
}

/* 2) белая заливка внутри контура */
.about__title-white {
  position: absolute;
  top: 50px;
  left: 68px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-size: 100px;
  font-weight: 700;
  line-height: 1;
  color: var(--clr-white);
  z-index: 2;
}

/* ----------------------------------------
   About‑Us Section: “US” Text
   ---------------------------------------- */
.about__title-us {
  position: absolute;
  top: 138px;               /* отступ от верха контейнера */
  left: 381px;              /* отступ слева */
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 700;         /* Bold */
  font-size: 100px;         /* размер шрифта */
  line-height: 1;           /* 100% */
  letter-spacing: 0;        /* без tracking */
  color: var(--clr-primary);/* rgba(181,13,218,1) */
  z-index: 2;               /* над фоном, под «ABOUT» контурами */
}

/* ----------------------------------------
   About‑Us Section: Description Text
   ---------------------------------------- */
.about__desc {
  position: absolute;
  top: 69px;                /* от верха контейнера */
  left: 823px;              /* от левого края контейнера */
  width: 514px;             /* фиксированная ширина */
  /* height можно не задавать — текст сам развернётся в нужный блок */
  
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;         /* Light */
  font-size: 20px;          /* размер шрифта */
  line-height: 1.1;           /* 100% */
  letter-spacing: 0;        /* без дополнительного трекинга */
  color: rgba(255, 255, 255, 1);
  
  z-index: 2;               /* между фоном и заголовками */
}
/* ========================================
   About‑Us Section: Cards Column
   ======================================== */
.about__cards {
  position: absolute;
  top: 200px;             /* от верха секции */
  left: 823px;            /* от левого края секции */
  width: 485.5px;         /* фиксированная ширина */
  display: flex;
  flex-direction: column;
  gap: 24px;              /* расстояние между карточками */
  z-index: 2;
}

/* обёртка для свечения (теперь всегда включено) */
.about__card-wrap {
  position: relative;
}

.about__card-wrap::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--clr-primary);
  filter: blur(32.8px);   /* сила свечения */
  opacity: 1;             /* свечение постоянно */
  z-index: 1;
  pointer-events: none;
}

/* сама карточка — над свечением и с обрезанными углами */
.about__card {
  position: relative;
  z-index: 2;             /* поверх свечения */
  width: 100%;
  height: 157px;          /* фиксированная высота */
  background: var(--clr-bg);
  padding: 24px;          /* отступы контента */
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: var(--clr-white);
  font-family: 'Montserrat', sans-serif;
  clip-path: polygon(
    0   0,
    calc(100% - 16px) 0,
    100% 16px,
    100% 100%,
    16px 100%,
    0   calc(100% - 16px)
  );
  /* убираем встроенную тень, теперь она через свечения */
  box-shadow: none;
}

/* заголовок внутри карточки */
.about__card h3 {
  margin: 0 0 8px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 1.2;
}

/* текст внутри карточки */
.about__card p {
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  font-weight: 200;
  font-size: 16px;
  line-height: 1.5;
}

/*FEATHER FORCE*/

.about__feather {
  /* отладочный фон */
  background:none;

  position: absolute;
  top: 39px;
  left: 473px;
  width: 95px;
  height: 24px;

  font-family: 'Vujahday Script', cursive;
  font-size: 18px;
  line-height: 1;
  color: #fff;

  transform: rotate(16.06deg);
  transform-origin: left top;

  z-index: 2;
}

/* ----------------------------------------
   about‑us: Twilight Tactics
---------------------------------------- */
.about__twilight {
  position: absolute;
  top: 539px;
  left: 601px;
  /* фиксировать width/height не обязательно, текст сам по себе */
  
  font-family: 'Vujahday Script', cursive;
  font-weight: 400;        /* Regular */
  font-size: 18px;
  line-height: 1;          /* 100% от font-size */
  letter-spacing: 0;

  color: #FFFFFF;          /* rgba(255,255,255,1) */
  
  transform: rotate(-14.41deg);
  transform-origin: left top;
  
  /* убедитесь, что никаких фонов нет */
  background: none;
}
/* ----------------------------------------
   about‑us: Hunt Mode (нижний правый угол)
---------------------------------------- */
.about__hunt {
  position: absolute;
  top: 760px;
  left: 1263px;
  
  font-family: 'Vujahday Script', cursive;
  font-weight: 400;        /* Regular */
  font-size: 18px;
  line-height: 1;          /* 100% от font-size */
  letter-spacing: 0;
  color: #FFFFFF;          /* rgba(255,255,255,1) */
  
  transform: rotate(-15.04deg);
  transform-origin: left top;
  
  background: none;       /* убираем любой фон */
}

/* ----------------------------------------
   about‑us: Arrow (декоративная стрелка)
---------------------------------------- */
.about__arrow {
  position: absolute;
  top: 319px;       /* от верха секции */
  left: 510px;      /* от левого края секции */
  width: 225.813px; /* точная ширина */
  height: 285.828px; /* точная высота */
  background-image: url('../assets/png/Arrow_aboutus.png');
  background-repeat: no-repeat;
  background-size: contain;
  transform: rotate(-3.23deg);
  transform-origin: left top;
  pointer-events: none;
  z-index: 3;       /* при необходимости скорректируйте, чтобы стрелка была над/под другими элементами */
}

/* ========================================
   About‑Us Section: Ripped Bottom Edge
   ======================================== */
.about__texture {
  position: absolute;
  bottom: -19px;    /* как и раньше */
  left: 0;          /* прижато к левому краю */
  width: 100%;      /* растягиваем по всей ширине родителя */
  height: 103px;
  object-fit: cover;
  z-index: 5;
  pointer-events: none;
}

/* ========================================
   Scoreboard Section (full‑screen bg)
   ======================================== */
.scoreboard {
  /* match your other full‑frame sections */
  position: relative;
  width: 100%;
  max-width: 1670px;      /* Figma frame width */
  height: 911px;          /* Figma frame height */
  margin: 0 auto;         /* center on wide viewports */

  /* solid dark base */
  background-color: rgba(11, 11, 11, 1);

  /* owl scoreboard graphic */
  background-image: url('../assets/png/owls_scoreboard.png');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;

  overflow: hidden;       /* clip any overflow */
  z-index: 1;
}
/* ========================================
   Scoreboard Heading: двойной “SCOREBOARD”
   ======================================== */
.scoreboard__heading {
  position: absolute;
  top: 0;
  left: 0;
  width: 708px;
  height: 125px;
  pointer-events: none;
}

.scoreboard__title-outline {
  position: absolute;
  top: 13px;
  left: 50px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-size: 101px;
  font-weight: 700;
  line-height: 1;
  
  color: transparent;
  -webkit-text-stroke: 1px var(--clr-white);
  
  /* glow‑эффект фиолетовым */
  text-shadow:
    0 4px 3.9px rgba(181, 13, 218, 1),
    0 8px 7px rgba(181, 13, 218, 0.2);
  
  z-index: 1;
}

.scoreboard__title-white {
  position: absolute;
  top: 14px;
  left: 51px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-size: 100px;
  font-weight: 700;
  line-height: 1;
  color: var(--clr-white);
  z-index: 2;
}
/* ========================================
   Scoreboard Divider Line
   ======================================== */
.scoreboard__divider {
  position: absolute;
  top: 114px;
  left: -6px;
  width: 1593px;
  height: 0;
  border-top: 1px solid rgba(254, 254, 254, 0.58);
  pointer-events: none;
  z-index: 2;
}
/* ========================================
   Scoreboard: second glowing card
   ======================================== */
.scoreboard__card2-wrap {
  position: absolute;
  top: 147px;
  left: 1060px;
  width: 363px;
  height: 125px;
  pointer-events: none;
  z-index: 2;
}

/* glow behind the card */
.scoreboard__card2-wrap::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(181, 13, 218, 1);
  filter: blur(74.5px);
  opacity: 1;
  z-index: 1;
  pointer-events: none;
}

/* the card itself, clipped corners */
.scoreboard__card2 {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  background: var(--clr-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  clip-path: polygon(
    0   0,
    calc(100% - 16px) 0,
    100% 16px,
    100% 100%,
    16px 100%,
    0   calc(100% - 16px)
  );
}

/* typography inside the card */
.scoreboard__card2 p {
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;      /* Medium */
  font-size: 20px;
  line-height: 1;
  color: var(--clr-white);
  text-align: center;
  padding: 0 16px;       /* по желанию, чтобы текст не «упёрся» в срезы */
}

.scoreboard__owl-area {
  position: absolute;
  background: transparent;
  cursor: pointer;
  pointer-events: all;
  z-index: 3; /* над фоном, под карточкой */
}
/* ========================================
   Scoreboard: Ripped Bottom Edge
   ======================================== */
.scoreboard__texture {
  position: absolute;
  bottom: -19px;      /* чуть выступает под блоком */
  left: 0;            /* начинаем ровно от левого края */
  width: 100%;        /* тянем на всю ширину контейнера/экрана */
  height: 103px;      /* оставляем нужную высоту */
  object-fit: cover;  /* масштабирование SVG без искажений */
  z-index: 5;         /* над другими элементами */
  pointer-events: none;
}

/* ----------------------------------------
   Our Team Section
---------------------------------------- */
.ourteam {
  position: relative;
  width: 100%;
  height: 1261px;       /* ваша высота фрейма */
  overflow: hidden;     /* обрезаем всё, что вышло за границы */
  background: none;     /* фон сбрасываем, всё в ::before */
}

/* псевдо-элемент подложки с повернутым фоном */
.ourteam::before {
  content: "";
  position: absolute;
  /* центрируем псевдо-элемент в середине блока */
  top: 50%;
  left: 50%;
  /* делаем квадрат по диагонали фрейма (~√(w²+h²)) */
  width: 1802px;        /* примерно √(1280²+1261²) */
  height: 1802px;
  /* фон */
  background-image: url('../assets/png/ourteam_background.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  /* сначала смещаем к центру, потом поворачиваем */
  transform: translate(-50%, -50%) rotate(90deg);

/* 1) уменьшаем фон до 80% */
  transform: translate(-50%, -50%) rotate(-90deg) scale(0.9);
  /* 2) делаем темнее (0.7 = 70% яркости) */
  filter: brightness(0.7);


  transform-origin: center center;
  z-index: 1;
  pointer-events: none;
}

/* рваный край сверху, перевёрнутый на 180° */
.ourteam__texture {
  position: absolute;
  top: -19px;          /* чуть выше секции */
  left: 0;
  width: 100%;
  height: 103px;
  object-fit: cover;
  transform: rotate(180deg);
  transform-origin: center center;
  z-index: 2;
  pointer-events: none;
}

/* контейнер для остального контента секции */
.ourteam__content {
  position: relative;
  z-index: 3;

  
}
/* ----------------------------------------
   Our Team Heading: “OUR TEAM”
---------------------------------------- */
.ourteam__heading {
  position: absolute;
  top: 71px;
  left: 47px;
  width: 539px;
  height: 123px;
  pointer-events: none;
  z-index: 3;
}

.ourteam__title {
  margin: 0;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 700;
  font-size: 100px;
  line-height: 1;
  white-space: nowrap;
}

.ourteam__our {
  color: #000; /* black */
}

.ourteam__team {
  color: var(--clr-white);
  text-shadow:
    0 4px 3.9px var(--clr-primary),
    0 8px 7px rgba(181, 13, 218, 0.2);
}
/* ----------------------------------------
   Our Team Section: Icon
---------------------------------------- */
.ourteam__icon {
  position: absolute;
  top: 126px;
  left: 586px;
  width: 75.23863220214844px;
  height: 83.32666015625px;
  z-index: 4; /* above background, below or above text as needed */
  pointer-events: none;
}
/* ----------------------------------------
   Our Team Section: Tagline (updated)
---------------------------------------- */
.ourteam__tagline {
  position: absolute;
  top: 216px;
  left: 56px;
  width: 595px;
  /* remove fixed height so it can grow if needed */
  /* height: 102px;  */
  
  /* no background this time */
  background: none;
  
  font-family: 'Vujahday Script', cursive;
  font-weight: 400;
  font-size: 23px;
  line-height: 1;
  letter-spacing: 0;
  
  /* deep charcoal text */
  color: rgba(11, 11, 11, 1);
  
  z-index: 3;  /* sit above the rotated background but beneath any UI overlays */
}
/* ----------------------------------------
   Our Team Section: Second Tagline
---------------------------------------- */
.ourteam__tagline2 {
  position: absolute;
  top: 150.55px;
  left: 1009.07px;
  width: 451px;
  /* высоту не задаём, чтобы текст сам переносился */
  
  font-family: 'Vujahday Script', cursive;
  font-weight: 400;            /* Regular */
  font-size: 23px;
  line-height: 1;              /* 100% */
  letter-spacing: 0;
  
  color: rgba(11, 11, 11, 1);
  
  /* точное вращение вокруг левого верхнего угла */
  transform: rotate(3.71deg);
  transform-origin: left top;
  
  background: none;            /* сбрасываем фон */
  z-index: 3;
}

/* ========================================
   Our Team Section: Cards
   ======================================== */
/* контейнер всех карточек */
.ourteam__content {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: visible;
}

/* базовый класс для карточки */
.ourteam__card {
  position: absolute;
  width: 300px;           /* фиксированная ширина */
  /* НЕ задаём height! пусть сохраняется исходное соотношение сторон */
  overflow: visible;      /* чтобы повёрнутая картинка не обрезалась */
  pointer-events: none;
  z-index: 3;
}

/* универсальные стили для <img> внутри карточки */
.ourteam__card img {
  display: block;
  width: 100%;
  height: auto;           /* авто-высота по пропорциям */
  transform-origin: center center;
}

/* повороты для каждой из трёх карточек */
.ourteam__auroracard img {
  transform: rotate(-19.96deg);
}
.ourteam__lunacard   img {
  transform: rotate(20.43deg);
}
.ourteam__atlascard  img {
  transform: rotate(6.22deg);
}

/* общий базовый стиль для патчей */
.ourteam__patch {
  position: absolute;
  pointer-events: none;
  z-index: 4; /* над карточкой */
}
/* — Патчи Aurora */
/* первый патч слева */
.ourteam__patch--1 {
  top: 425px;
  left: 100px;
  width: 107.618px;
  height: 104.999px;
}

/* второй патч сверху */
.ourteam__patch--2 {
  top: 330px;
  left: 352px;
  width: 126.985px;
  height: 113.460px;
}

/* — Патчи Luna */
.ourteam__patch--luna-1 {
   top: 255px;
  left: 665px;
  width: 107.589px;
  height: 104.907px;
}
.ourteam__patch--luna-2 {
top: 345px;
  left: 900px;
  width: 126.985px;
  height: 113.460px;
}

/* — Патчи Atlas */
.ourteam__patch--atlas-1 {
  top: 515px;
  left: 990px;
  width: 107.622px;
  height: 104.999px;
}
.ourteam__patch--atlas-2 {
  top: 545px;
  left: 1240px;
  width: 108.000px;
  height: 105.358px;
}

/* ========================================
   Our Team Section: Captions
   ======================================== */
.ourteam__caption {
  position: absolute;
  font-family: 'Vujahday Script', cursive;
  font-weight: 400;    /* Regular */
  font-size: 23px;
  line-height: 1;      /* 100% */
  letter-spacing: 0;
  color: rgba(11, 11, 11, 1);
  pointer-events: none;
  transform-origin: left top;
}

.ourteam__caption--1 {
  top: 904.42px;
  left: 220px;
  width: 204px;   
  height: 34px;
  transform: rotate(-6deg);
}

.ourteam__caption--2 {
  top: 748px;
  left: 681px;
  width: 253px;
  height: 34px;
  transform: rotate(20.11deg);
}

.ourteam__caption--3 {
  top: 1021.45px;
  left: 1068.03px;
  width: 295px;
  height: 34px;
  transform: rotate(-6.09deg);
}
/* ========================================
   Our Team Section: INBOX & HUNTERS
   ======================================== */
.ourteam__inbox {
  position: absolute;
  top: 990px;
  left: 370px;
  width: 336px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 700;        
  font-size: 100px;
  line-height: 1;          
  letter-spacing: 0;
  color: rgba(11, 11, 11, 1);
  white-space: nowrap;
  pointer-events: none;
  z-index: 3;
}

.ourteam__hunters {
  position: absolute;
  top: 1107px;
  left: 73px;
  width: 490px;
  height: 123px;
  pointer-events: none;
  z-index: 3;
}

.ourteam__hunters-outline,
.ourteam__hunters-white {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 700;        
  font-size: 100px;
  line-height: 1;
  white-space: nowrap;
}

.ourteam__hunters-outline {
  color: transparent;
  -webkit-text-stroke: 1px var(--clr-primary);
  text-shadow: 0 4px 3.9px var(--clr-primary);
  z-index: 1;
}

.ourteam__hunters-white {
  color: var(--clr-white);
  z-index: 2;
}
/* ========================================
   Our Team Section
   ======================================== */
.ourteam__final-text {
  position: absolute;
  top: 1155px;
  left: 733px;
  width: 525px;
  font-family: 'Vujahday Script', cursive;
  font-weight: 400;        
  font-size: 23px;
  line-height: 1;          
  letter-spacing: 0;
  color: rgba(11, 11, 11, 1);
  transform: rotate(-6.17deg);
  transform-origin: left top;
  pointer-events: none;
  z-index: 3;
}
/* ========================================
   Contact Us Section
   ======================================== */
.contact {
  position: relative;
  width: 100%;
  max-width: 1280px;         
  height: 875px;             
  margin: 0 auto;            
  background-color: rgba(11, 11, 11, 1);
  overflow: hidden;
  z-index: 1;
}

.contact__heading {
  position: absolute;
  top: 32px;
  left: 50px;
  width: 654px;
  height: 123px;
  pointer-events: none;
  z-index: 2;
}

.contact__title-outline {
  position: absolute;
  top: 0;
  left: 0;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 700;
  font-size: 100px;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1px var(--clr-primary);
  text-shadow:
    0 4px 3.9px var(--clr-primary),
    0 8px 7px rgba(181, 13, 218, 0.2);
  z-index: 1;
}

.contact__title-white {
  position: absolute;
  top: 0;
  left: 0;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 700;
  font-size: 100px;
  line-height: 1;
  color: var(--clr-white);
  z-index: 2;
}
/* ========================================
   Contact Us Section: Illustration
   ======================================== */
.contact__image {
  position: absolute;
  top: 162px;
  left: 278px;
  width: 724.151px;
  height: 411px;
  object-fit: cover;
  pointer-events: none;
  z-index: 1; 
}
/* ========================================
   Contact Us Section: Button
   ======================================== */
.contact__btn-wrap {
  position: absolute;
  top: 609px;
  left: 285px;
  width: 710px;
  display: inline-block;
}

.contact__btn-wrap::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--clr-primary);
  filter: blur(32.8px);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 1;
  pointer-events: none;
}

.contact__btn-wrap:hover::before {
  opacity: 1;
}

.contact__btn {
  position: relative;
  z-index: 2;               
  width: 100%;
  height: 43px;
  background: var(--clr-primary);
  color: var(--clr-bg);
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 600;
  font-size: 23px;
  text-transform: uppercase;
  text-align: center;
  line-height: 43px;
  border: none;
  cursor: pointer;
  clip-path: polygon(
    0   0,
    calc(100% - 16px) 0,
    100% 16px,
    100% 100%,
    16px 100%,
    0   calc(100% - 16px)
  );
}
.footer__header {
  position: relative;
  padding: 15px 50px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background: var(--clr-bg);
}

.footer__header .hero__logo img {
  width: 113px;
  height: 53px;
}

.footer__header .hero__group {
  display: flex;
  gap: 141px;
}

.footer__header .hero__nav ul {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.footer__header .hero__nav a {
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  font-size: 16px;
  color: var(--clr-white);
}

.footer__header .hero__icons {
  display: flex;
  gap: 9px;
}

.footer__header .hero__icons img {
  width: 23px;
  height: 23px;
}

.footer__copy {
  position: absolute;
  bottom: 20px;
  right: 50px;
  font-family: 'Schibsted Grotesk', sans-serif;
  font-size: 10px;
  font-weight: 400;              
  color: rgba(254,254,254,1);
}