/* ==========================================================
   DAWN ABOUT PAGE

   IMPORTANT:
   Global fonts, variables, buttons, nav, footer, container,
   reveal animations etc. come from style.css.
========================================================== */


/* ==========================================================
   ABOUT HERO
========================================================== */

.about-hero {

  position: relative;

  min-height: 820px;

  padding:
    175px 0 95px;

  overflow: hidden;

  background:

    radial-gradient(
      circle at 0% 0%,
      rgba(24,76,125,.27),
      transparent 35%
    ),

    radial-gradient(
      circle at 88% 20%,
      rgba(64,92,183,.12),
      transparent 31%
    ),

    linear-gradient(
      140deg,
      #07111c 0%,
      #030608 52%,
      #07111c 100%
    );

}


.about-hero-grid {

  position: absolute;

  inset: 0;

  opacity: .055;

  background-image:

    linear-gradient(
      rgba(105,200,250,.08) 1px,
      transparent 1px
    ),

    linear-gradient(
      90deg,
      rgba(105,200,250,.08) 1px,
      transparent 1px
    );

  background-size:
    68px 68px;

}


.about-orb {

  position: absolute;

  border-radius: 50%;

  filter:
    blur(105px);

  pointer-events: none;

}


.about-orb-one {

  width: 500px;
  height: 500px;

  left: -230px;
  bottom: 10px;

  background:
    rgba(57,150,220,.08);

}


.about-orb-two {

  width: 520px;
  height: 520px;

  right: -190px;
  top: 80px;

  background:
    rgba(122,112,255,.065);

}


.about-hero-layout {

  position: relative;

  z-index: 2;

  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 90px;

  align-items: center;

}


.about-hero-copy h1 {

  max-width: 760px;

  margin-top: 22px;

  font-size:
    clamp(
      54px,
      5.5vw,
      78px
    );

  line-height:
    .99;

  letter-spacing:
    -4.6px;

}


.about-hero-copy h1 > span {

  display: block;

  color: transparent;

  background:
    linear-gradient(
      90deg,
      var(--blue),
      var(--violet)
    );

  -webkit-background-clip:
    text;

  background-clip:
    text;

}


.about-hero-description {

  max-width:
    650px;

  margin-top:
    27px;

  font-size:
    16px;

}


.about-hero-actions {

  display: flex;

  flex-wrap: wrap;

  gap: 12px;

  margin-top: 30px;

}



/* ==========================================================
   COMPANY HERO VISUAL
========================================================== */

.about-company-visual {

  position: relative;

  perspective:
    1300px;

}


.about-company-visual::before {

  content: "";

  position: absolute;

  width: 80%;
  height: 80%;

  left: 10%;
  top: 10%;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(76,110,220,.13),
      transparent 69%
    );

  filter:
    blur(55px);

}


.about-company-card {

  position: relative;

  z-index: 2;

  min-height: 520px;

  padding: 30px;

  overflow: hidden;

  border-radius:
    23px;

  border:
    1px solid
    rgba(105,200,250,.17);

  background:

    radial-gradient(
      circle at 85% 10%,
      rgba(95,91,224,.10),
      transparent 29%
    ),

    linear-gradient(
      145deg,
      rgba(17,29,45,.98),
      rgba(7,13,21,.98)
    );

  box-shadow:
    0 50px 110px
    rgba(0,0,0,.43);

}


.about-company-card::before {

  content: "";

  position: absolute;

  top: 0;
  left: 12%;

  width: 40%;
  height: 1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      var(--blue),
      var(--violet),
      transparent
    );

}


.about-company-card-top {

  display: flex;

  align-items:
    flex-start;

  justify-content:
    space-between;

  padding-bottom:
    20px;

  border-bottom:
    1px solid
    var(--border);

}


.about-company-card-top span {

  color:
    var(--blue);

  font-size:
    9px;

  font-weight:
    700;

  letter-spacing:
    1.4px;

}


.about-company-card-top h3 {

  margin-top:
    7px;

  font-size:
    21px;

}


.about-active-status {

  display: inline-flex;

  align-items:
    center;

  gap: 7px;

  color:
    var(--cyan);

  font-size:
    10px;

}


.about-active-status i {

  width: 7px;
  height: 7px;

  border-radius:
    50%;

  background:
    var(--cyan);

  animation:
    pulse 1.6s infinite;

}



/* CENTER */

.about-company-center {

  position: relative;

  height:
    325px;

}


.company-orbit {

  position: absolute;

  left: 50%;
  top: 50%;

  border-radius:
    50%;

  border:
    1px solid
    rgba(105,200,250,.11);

  transform:
    translate(-50%,-50%);

}


.company-orbit-one {

  width:
    275px;

  height:
    275px;

}


.company-orbit-two {

  width:
    210px;

  height:
    210px;

  border-color:
    rgba(142,145,255,.11);

}


.company-core {

  position: absolute;

  left: 50%;
  top: 50%;

  width:
    180px;

  transform:
    translate(-50%,-50%);

  text-align:
    center;

}


.company-core-logo {

  width:
    56px;

  height:
    56px;

  margin:
    0 auto 16px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  color:
    #061018;

  background:
    linear-gradient(
      135deg,
      var(--blue),
      var(--violet)
    );

  font-family:
    "Manrope",
    sans-serif;

  font-size:
    19px;

  font-weight:
    800;

}


.company-core span {

  display:
    block;

  color:
    var(--blue);

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    1.2px;

}


.company-core strong {

  display:
    block;

  margin-top:
    7px;

  font-family:
    "Manrope",
    sans-serif;

  font-size:
    15px;

}


.company-node {

  position:
    absolute;

  display:
    flex;

  align-items:
    center;

  gap:
    10px;

  padding:
    11px 13px;

  border-radius:
    11px;

  border:
    1px solid
    rgba(105,200,250,.12);

  background:
    rgba(8,16,26,.92);

  box-shadow:
    0 16px 35px
    rgba(0,0,0,.25);

  animation:
    companyNodeFloat
    4s ease-in-out infinite;

}


.node-research {

  left:
    3%;

  top:
    24%;

}


.node-outreach {

  right:
    1%;

  top:
    35%;

  animation-delay:
    .7s;

}


.node-qualification {

  left:
    18%;

  bottom:
    9%;

  animation-delay:
    1.3s;

}


.company-node > span {

  width:
    34px;

  height:
    34px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    9px;

  color:
    var(--blue);

  background:
    rgba(105,200,250,.05);

}


.company-node svg {

  width:
    15px;

  height:
    15px;

}


.company-node small {

  display:
    block;

  color:
    #67798c;

  font-size:
    7px;

}


.company-node strong {

  display:
    block;

  margin-top:
    2px;

  font-size:
    9px;

}


@keyframes companyNodeFloat {

  50% {

    transform:
      translateY(-6px);

  }

}



/* FOOTER METRICS */

.about-company-footer {

  display:
    grid;

  grid-template-columns:
    repeat(3,1fr);

  gap:
    10px;

  padding-top:
    16px;

  border-top:
    1px solid
    var(--border);

}


.about-company-footer > div {

  padding:
    12px;

  border-radius:
    9px;

  border:
    1px solid
    rgba(155,187,218,.08);

  background:
    rgba(255,255,255,.015);

}


.about-company-footer span {

  display:
    block;

  color:
    #718294;

  font-size:
    8px;

}


.about-company-footer strong {

  display:
    block;

  margin-top:
    4px;

  font-size:
    11px;

}



/* ==========================================================
   OUR COMPANY
========================================================== */

.about-company-section {

  background:

    radial-gradient(
      circle at 88% 5%,
      rgba(40,90,145,.08),
      transparent 30%
    ),

    linear-gradient(
      180deg,
      #05090d,
      #07111c
    );

}


.about-company-heading {

  display:
    grid;

  grid-template-columns:
    1.1fr .9fr;

  gap:
    90px;

  align-items:
    end;

  margin-bottom:
    52px;

}


.about-company-heading h2 {

  max-width:
    750px;

}


.about-company-heading-copy {

  padding-bottom:
    5px;

}


.about-company-heading-copy p:first-child {

  margin-bottom:
    13px;

  color:
    #d0d9e2;

  font-size:
    17px;

  font-weight:
    500;

}


.company-story-panel {

  display:
    grid;

  grid-template-columns:
    .9fr 1.1fr;

  overflow:
    hidden;

  border-radius:
    22px;

  border:
    1px solid
    var(--border);

  background:
    linear-gradient(
      145deg,
      #111c2b,
      #08111c
    );

}


.company-story-main {

  position:
    relative;

  min-height:
    500px;

  padding:
    50px;

  border-right:
    1px solid
    var(--border);

}


.company-story-number {

  position:
    absolute;

  right:
    35px;

  top:
    35px;

  color:
    #506174;

  font-size:
    10px;

}


.company-story-icon {

  width:
    50px;

  height:
    50px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    13px;

  color:
    var(--blue);

  background:
    rgba(105,200,250,.05);

  border:
    1px solid
    rgba(105,200,250,.14);

}


.company-story-icon svg {

  width:
    20px;

  height:
    20px;

}


.company-story-label {

  display:
    block;

  margin-top:
    48px;

  color:
    var(--blue);

  font-size:
    9px;

  font-weight:
    700;

  letter-spacing:
    1.5px;

}


.company-story-main h3 {

  max-width:
    540px;

  margin-top:
    12px;

  font-size:
    clamp(
      29px,
      3vw,
      39px
    );

  line-height:
    1.09;

  letter-spacing:
    -1.7px;

}


.company-story-main h3 span {

  display:
    block;

  color:
    var(--blue);

}


.company-story-main > p {

  max-width:
    540px;

  margin-top:
    18px;

  font-size:
    14px;

}


.company-story-tags {

  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    7px;

  margin-top:
    25px;

}


.company-story-tags span {

  padding:
    7px 10px;

  border:
    1px solid
    rgba(155,187,218,.10);

  border-radius:
    100px;

  color:
    #8293a6;

  font-size:
    9px;

}


.company-story-points {

  display:
    grid;

  grid-template-rows:
    repeat(3,1fr);

}


.company-story-points article {

  display:
    grid;

  grid-template-columns:
    auto 1fr;

  gap:
    19px;

  align-items:
    center;

  padding:
    34px 42px;

  border-bottom:
    1px solid
    var(--border);

  transition:
    background .25s ease;

}


.company-story-points article:last-child {

  border-bottom:
    0;

}


.company-story-points article:hover {

  background:
    rgba(105,200,250,.025);

}


.story-point-icon {

  width:
    45px;

  height:
    45px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    11px;

  color:
    var(--blue);

  background:
    rgba(105,200,250,.045);

  border:
    1px solid
    rgba(105,200,250,.13);

}


.story-point-icon svg {

  width:
    18px;

  height:
    18px;

}


.company-story-points span {

  color:
    var(--blue);

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    1.3px;

}


.company-story-points h4 {

  margin-top:
    5px;

  font-size:
    17px;

}


.company-story-points p {

  max-width:
    430px;

  margin-top:
    5px;

  font-size:
    12px;

}



/* ==========================================================
   BELIEFS
========================================================== */

.about-belief-section {

  background:

    radial-gradient(
      circle at 15% 45%,
      rgba(24,80,130,.08),
      transparent 32%
    ),

    #05090d;

}


.belief-grid {

  display:
    grid;

  grid-template-columns:
    repeat(3,1fr);

  gap:
    16px;

}


.belief-card {

  min-height:
    330px;

  padding:
    28px;

  border-radius:
    18px;

  border:
    1px solid
    var(--border);

  background:
    linear-gradient(
      145deg,
      #101823,
      #080d13
    );

  transition:
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;

}


.belief-card:hover {

  transform:
    translateY(-7px);

  border-color:
    var(--border-hover);

  box-shadow:
    0 25px 65px
    rgba(0,0,0,.25);

}


.belief-card-top {

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

}


.belief-number {

  color:
    #66788a;

  font-size:
    10px;

}


.belief-icon {

  width:
    46px;

  height:
    46px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    13px;

  color:
    var(--blue);

  border:
    1px solid
    rgba(105,200,250,.14);

  background:
    rgba(105,200,250,.04);

}


.belief-icon svg {

  width:
    19px;

  height:
    19px;

}


.belief-card h3 {

  max-width:
    330px;

  margin-top:
    65px;

  font-size:
    23px;

  line-height:
    1.15;

}


.belief-card p {

  margin-top:
    12px;

  max-width:
    350px;

  font-size:
    13px;

}



/* ==========================================================
   OPERATING MODEL
========================================================== */

.company-operating-section {

  background:

    radial-gradient(
      circle at 87% 10%,
      rgba(52,72,170,.09),
      transparent 30%
    ),

    linear-gradient(
      180deg,
      #07101a,
      #05080c
    );

}


.company-operating-heading {

  max-width:
    780px;

  margin:
    0 auto 48px;

  text-align:
    center;

}


.company-operating-heading .section-label {

  width:
    fit-content;

  margin:
    0 auto 16px;

}


.company-operating-heading p {

  max-width:
    610px;

  margin:
    17px auto 0;

}


.operating-panel {

  display:
    grid;

  grid-template-columns:
    .78fr 1.22fr;

  overflow:
    hidden;

  border-radius:
    22px;

  border:
    1px solid
    var(--border);

  background:

    radial-gradient(
      circle at 80% 0%,
      rgba(77,86,201,.08),
      transparent 29%
    ),

    linear-gradient(
      145deg,
      #142239,
      #0a1422
    );

}


.operating-left {

  min-height:
    520px;

  padding:
    48px;

  display:
    flex;

  flex-direction:
    column;

  border-right:
    1px solid
    var(--border);

}


.operating-badge {

  width:
    fit-content;

  padding:
    8px 11px;

  border:
    1px solid
    rgba(105,200,250,.15);

  border-radius:
    100px;

  color:
    var(--blue);

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    1.3px;

}


.operating-left h3 {

  margin-top:
    35px;

  font-size:
    35px;

  line-height:
    1.08;

  letter-spacing:
    -1.8px;

}


.operating-left h3 span {

  display:
    block;

  color:
    var(--blue);

}


.operating-left p {

  margin-top:
    18px;

  font-size:
    13px;

}


.operating-link {

  width:
    fit-content;

  margin-top:
    auto;

  display:
    inline-flex;

  align-items:
    center;

  gap:
    8px;

  color:
    var(--blue);

  font-size:
    11px;

  font-weight:
    700;

}


.operating-link svg {

  width:
    14px;

  height:
    14px;

}


.operating-grid {

  display:
    grid;

  grid-template-columns:
    1fr 1fr;

}


.operating-grid article {

  position:
    relative;

  min-height:
    260px;

  padding:
    30px;

  border-right:
    1px solid
    var(--border);

  border-bottom:
    1px solid
    var(--border);

  transition:
    background .25s ease;

}


.operating-grid article:hover {

  background:
    rgba(105,200,250,.025);

}


.operating-step {

  position:
    absolute;

  right:
    24px;

  top:
    24px;

  color:
    #54677a;

  font-size:
    9px;

}


.operating-icon {

  width:
    45px;

  height:
    45px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    11px;

  color:
    var(--blue);

  background:
    rgba(105,200,250,.05);

  border:
    1px solid
    rgba(105,200,250,.13);

}


.operating-icon svg {

  width:
    18px;

  height:
    18px;

}


.operating-grid h4 {

  margin-top:
    44px;

  font-size:
    20px;

}


.operating-grid p {

  max-width:
    300px;

  margin-top:
    9px;

  font-size:
    11px;

}



/* ==========================================================
   PRINCIPLES
========================================================== */

.principles-section {

  background:
    #05090d;

}


.principles-heading {

  margin-bottom:
    48px;

}


.principles-heading h2 {

  max-width:
    680px;

}


.principles-list {

  border-top:
    1px solid
    var(--border);

}


.principle-row {

  display:
    grid;

  grid-template-columns:
    70px 70px 1fr 1.1fr;

  gap:
    25px;

  align-items:
    center;

  min-height:
    145px;

  border-bottom:
    1px solid
    var(--border);

  transition:
    background .25s ease,
    padding .25s ease;

}


.principle-row:hover {

  padding:
    0 15px;

  background:
    linear-gradient(
      90deg,
      rgba(105,200,250,.025),
      transparent
    );

}


.principle-index {

  color:
    #607286;

  font-size:
    10px;

}


.principle-icon {

  width:
    45px;

  height:
    45px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    11px;

  color:
    var(--blue);

  border:
    1px solid
    rgba(105,200,250,.14);

  background:
    rgba(105,200,250,.04);

}


.principle-icon svg {

  width:
    17px;

  height:
    17px;

}


.principle-row h3 {

  font-size:
    20px;

}


.principle-row p {

  max-width:
    520px;

  font-size:
    13px;

}



/* ==========================================================
   CLIENT + DAWN
========================================================== */

.experience-section {

  background:

    radial-gradient(
      circle at 15% 40%,
      rgba(31,91,144,.09),
      transparent 30%
    ),

    linear-gradient(
      180deg,
      #07101a,
      #04070a
    );

}


.experience-layout {

  display:
    grid;

  grid-template-columns:
    .8fr 1.2fr;

  gap:
    75px;

  align-items:
    center;

}


.experience-copy h2 {

  max-width:
    570px;

}


.experience-copy > p {

  max-width:
    520px;

  margin-top:
    18px;

}


.experience-copy > .btn {

  margin-top:
    27px;

}


.experience-card {

  padding:
    30px;

  border-radius:
    21px;

  border:
    1px solid
    var(--border);

  background:

    radial-gradient(
      circle at 90% 0%,
      rgba(91,87,215,.09),
      transparent 30%
    ),

    linear-gradient(
      145deg,
      #111d2d,
      #08121d
    );

  box-shadow:
    0 35px 90px
    rgba(0,0,0,.27);

}


.experience-card-header {

  display:
    flex;

  justify-content:
    space-between;

  align-items:
    center;

  padding-bottom:
    18px;

  border-bottom:
    1px solid
    var(--border);

}


.experience-card-header > span {

  color:
    var(--blue);

  font-size:
    9px;

  font-weight:
    700;

  letter-spacing:
    1.4px;

}


.experience-card-header > div {

  display:
    flex;

  align-items:
    center;

  gap:
    7px;

  color:
    var(--cyan);

  font-size:
    9px;

}


.experience-card-header i {

  width:
    6px;

  height:
    6px;

  border-radius:
    50%;

  background:
    var(--cyan);

}


.experience-team {

  display:
    grid;

  grid-template-columns:
    1fr auto 1fr;

  gap:
    20px;

  align-items:
    center;

  padding:
    42px 0;

}


.experience-team-card {

  min-height:
    175px;

  padding:
    21px;

  border-radius:
    14px;

  border:
    1px solid
    rgba(155,187,218,.10);

  background:
    rgba(255,255,255,.015);

}


.experience-avatar {

  width:
    45px;

  height:
    45px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  color:
    #061018;

  font-weight:
    800;

}


.client-avatar {

  background:
    linear-gradient(
      135deg,
      #a4b5c7,
      #e2ebf3
    );

}


.dawn-avatar {

  background:
    linear-gradient(
      135deg,
      var(--blue),
      var(--violet)
    );

}


.experience-team-card small {

  display:
    block;

  margin-top:
    18px;

  color:
    var(--blue);

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    1.3px;

}


.experience-team-card strong {

  display:
    block;

  margin-top:
    6px;

  font-size:
    13px;

}


.experience-team-card p {

  margin-top:
    6px;

  font-size:
    9px;

}


.experience-connector {

  display:
    flex;

  flex-direction:
    column;

  align-items:
    center;

  gap:
    8px;

}


.experience-connector > span {

  width:
    1px;

  height:
    30px;

  background:
    linear-gradient(
      var(--border),
      var(--blue)
    );

}


.experience-connector div {

  width:
    35px;

  height:
    35px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  border:
    1px solid
    rgba(105,200,250,.16);

  color:
    var(--blue);

}


.experience-connector svg {

  width:
    14px;

  height:
    14px;

}


.experience-result {

  padding:
    20px;

  border-radius:
    12px;

  border:
    1px solid
    rgba(93,217,200,.12);

  background:
    rgba(93,217,200,.025);

}


.experience-result span {

  display:
    block;

  color:
    var(--cyan);

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    1.3px;

}


.experience-result strong {

  display:
    block;

  max-width:
    520px;

  margin-top:
    8px;

  font-size:
    15px;

  line-height:
    1.45;

}



/* ==========================================================
   FINAL CTA
========================================================== */

.company-cta-section {

  background:

    radial-gradient(
      circle at 82% 30%,
      rgba(69,81,195,.11),
      transparent 30%
    ),

    #05090d;

}


.company-cta {

  min-height:
    430px;

  display:
    grid;

  grid-template-columns:
    1fr .72fr;

  overflow:
    hidden;

  border-radius:
    22px;

  border:
    1px solid
    rgba(105,200,250,.17);

  background:

    radial-gradient(
      circle at 85% 30%,
      rgba(78,88,215,.12),
      transparent 32%
    ),

    linear-gradient(
      135deg,
      #142540,
      #0c1729
    );

  box-shadow:
    0 38px 95px
    rgba(0,0,0,.27);

}


.company-cta-copy {

  padding:
    57px;

  display:
    flex;

  flex-direction:
    column;

  justify-content:
    center;

}


.company-cta-label {

  color:
    var(--blue);

  font-size:
    9px;

  font-weight:
    700;

  letter-spacing:
    1.6px;

}


.company-cta h2 {

  max-width:
    680px;

  margin-top:
    17px;

  font-size:
    clamp(
      38px,
      4vw,
      54px
    );

}


.company-cta h2 span {

  display:
    block;

}


.company-cta-copy > p {

  max-width:
    560px;

  margin-top:
    18px;

}


.company-cta-actions {

  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    11px;

  margin-top:
    28px;

}


.company-cta-visual {

  position:
    relative;

  min-height:
    430px;

  display:
    grid;

  place-items:
    center;

}


.cta-company-orbit {

  position:
    absolute;

  border-radius:
    50%;

  border:
    1px solid
    rgba(105,200,250,.11);

}


.orbit-large {

  width:
    320px;

  height:
    320px;

}


.orbit-small {

  width:
    235px;

  height:
    235px;

  border-color:
    rgba(142,145,255,.12);

}


.cta-company-card {

  position:
    relative;

  z-index:
    2;

  width:
    235px;

  padding:
    27px;

  border-radius:
    16px;

  border:
    1px solid
    rgba(105,200,250,.19);

  background:
    linear-gradient(
      145deg,
      #0d1929,
      #07111b
    );

  box-shadow:
    0 28px 70px
    rgba(0,0,0,.35);

}


.cta-company-avatar {

  width:
    52px;

  height:
    52px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  color:
    #061018;

  background:
    linear-gradient(
      135deg,
      var(--blue),
      var(--violet)
    );

  font-family:
    "Manrope",
    sans-serif;

  font-weight:
    800;

}


.cta-company-card > span {

  display:
    block;

  margin-top:
    23px;

  color:
    var(--blue);

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    1.5px;

}


.cta-company-card strong {

  display:
    block;

  margin-top:
    7px;

  font-size:
    16px;

}


.cta-company-card p {

  margin-top:
    7px;

  font-size:
    9px;

}


.cta-company-status {

  margin-top:
    21px;

  display:
    flex;

  align-items:
    center;

  gap:
    7px;

  color:
    var(--cyan);

  font-size:
    9px;

}


.cta-company-status i {

  width:
    6px;

  height:
    6px;

  border-radius:
    50%;

  background:
    var(--cyan);

  animation:
    pulse 1.6s infinite;

}



/* ==========================================================
   RESPONSIVE
========================================================== */

@media(max-width:1100px) {

  .about-hero-layout,
  .about-company-heading,
  .experience-layout {

    grid-template-columns:
      1fr;

  }


  .about-hero-layout {

    gap:
      55px;

  }


  .company-story-panel,
  .operating-panel {

    grid-template-columns:
      1fr;

  }


  .company-story-main,
  .operating-left {

    border-right:
      0;

    border-bottom:
      1px solid
      var(--border);

  }


  .belief-grid {

    grid-template-columns:
      repeat(2,1fr);

  }


  .company-cta {

    grid-template-columns:
      1fr;

  }

}



@media(max-width:768px) {

  .about-hero {

    min-height:
      auto;

    padding:
      135px 0 70px;

  }


  .about-hero-copy h1 {

    font-size:
      clamp(
        44px,
        12vw,
        58px
      );

    line-height:
      1;

    letter-spacing:
      -3px;

  }


  .about-hero-description {

    font-size:
      15px;

  }


  .about-company-card {

    min-height:
      auto;

    padding:
      20px;

  }


  .about-company-center {

    height:
      310px;

  }


  .company-node {

    transform:
      scale(.88);

  }


  .node-research {

    left:
      -5%;

  }


  .node-outreach {

    right:
      -5%;

  }


  .company-story-main {

    min-height:
      auto;

    padding:
      32px 24px;

  }


  .company-story-points article {

    padding:
      26px 24px;

  }


  .belief-grid {

    grid-template-columns:
      1fr;

  }


  .belief-card {

    min-height:
      280px;

  }


  .operating-left {

    min-height:
      auto;

    padding:
      34px 24px;

  }


  .operating-link {

    margin-top:
      28px;

  }


  .operating-grid {

    grid-template-columns:
      1fr;

  }


  .operating-grid article {

    min-height:
      230px;

  }


  .principle-row {

    grid-template-columns:
      45px 48px 1fr;

    gap:
      14px;

    padding:
      24px 0;

  }


  .principle-row p {

    grid-column:
      3;

    margin-top:
      -7px;

  }


  .experience-team {

    grid-template-columns:
      1fr;

  }


  .experience-connector {

    flex-direction:
      row;

  }


  .experience-connector > span {

    width:
      40px;

    height:
      1px;

  }


  .company-cta-copy {

    padding:
      39px 24px 20px;

  }


  .company-cta-visual {

    min-height:
      350px;

  }


  .company-cta-actions,
  .about-hero-actions {

    flex-direction:
      column;

  }


  .company-cta-actions .btn,
  .about-hero-actions .btn {

    width:
      100%;

  }

}



@media(max-width:520px) {

  .about-company-footer {

    grid-template-columns:
      1fr;

  }


  .company-node {

    display:
      none;

  }


  .company-orbit-one {

    width:
      240px;

    height:
      240px;

  }


  .company-orbit-two {

    width:
      185px;

    height:
      185px;

  }


  .about-company-center {

    height:
      270px;

  }


  .principle-row {

    grid-template-columns:
      38px 1fr;

  }


  .principle-icon {

    grid-row:
      1 / 3;

    grid-column:
      1;

  }


  .principle-index {

    display:
      none;

  }


  .principle-row h3,
  .principle-row p {

    grid-column:
      2;

  }

}
/* ==========================================================
   ABOUT PAGE — REVENUE GROWTH UPDATE
========================================================== */


/* ==========================================================
   HERO UPDATES
========================================================== */

.about-hero-secondary {

  max-width: 650px;

  margin-top: 14px;

  color: #8396a7;

  font-size: 13px;

  line-height: 1.72;

}


.about-revenue-center {

  height: 335px;

}


.about-service-node {

  color: inherit;

  text-decoration: none;

  transition:
    transform .3s ease,
    border-color .3s ease,
    background .3s ease;

}


.about-service-node:hover {

  transform: translateY(-6px);

  border-color:
    rgba(105,200,250,.28);

  background:
    rgba(13,28,44,.98);

}


.node-sales {

  left: 1%;

  top: 24%;

}


.node-marketing {

  right: 0;

  top: 35%;

  animation-delay: .7s;

}


.node-ai {

  left: 17%;

  bottom: 8%;

  animation-delay: 1.3s;

}



/* ==========================================================
   CAPABILITIES
========================================================== */

.about-capabilities-section {

  background:

    radial-gradient(
      circle at 86% 12%,
      rgba(72,72,190,.08),
      transparent 31%
    ),

    #05090d;

}


.about-capability-grid {

  display: grid;

  grid-template-columns:
    repeat(3,1fr);

  gap: 16px;

  margin-top: 50px;

}


.about-capability-card {

  position: relative;

  min-height: 425px;

  padding: 30px;

  display: flex;

  flex-direction: column;

  border-radius: 19px;

  border:
    1px solid
    var(--border);

  background:

    linear-gradient(
      145deg,
      #101c2b,
      #080f16
    );

  transition:
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;

}


.about-capability-card:hover {

  transform:
    translateY(-7px);

  border-color:
    var(--border-hover);

  box-shadow:
    0 25px 70px
    rgba(0,0,0,.24);

}


.about-capability-card.featured {

  border-color:
    rgba(135,130,255,.23);

  background:

    radial-gradient(
      circle at 90% 0%,
      rgba(115,90,220,.10),
      transparent 37%
    ),

    linear-gradient(
      145deg,
      #132138,
      #08111b
    );

}


.about-capability-top {

  display: flex;

  align-items: center;

  justify-content:
    space-between;

}


.about-capability-icon {

  width: 49px;
  height: 49px;

  display: grid;

  place-items: center;

  border-radius: 12px;

  color:
    var(--blue);

  border:
    1px solid
    rgba(105,200,250,.15);

  background:
    rgba(105,200,250,.045);

}


.about-capability-icon svg {

  width: 20px;
  height: 20px;

}


.about-capability-top > span {

  color:
    var(--blue);

  font-size: 8px;

  font-weight: 700;

  letter-spacing: 1.3px;

}


.about-capability-card h3 {

  max-width: 360px;

  margin-top: 47px;

  font-size: 23px;

  line-height: 1.18;

}


.about-capability-card > p {

  margin-top: 13px;

  font-size: 12px;

  line-height: 1.72;

}


.about-capability-tags {

  display: flex;

  flex-wrap: wrap;

  gap: 7px;

  margin-top: 24px;

}


.about-capability-tags span {

  padding:
    7px 9px;

  border-radius: 100px;

  border:
    1px solid
    rgba(155,187,218,.10);

  color:
    #8294a5;

  font-size: 8px;

}


.about-capability-link {

  width: fit-content;

  margin-top: auto;

  padding-top: 28px;

  display: inline-flex;

  align-items: center;

  gap: 8px;

  color:
    var(--blue);

  font-size: 10px;

  font-weight: 700;

  text-decoration: none;

}


.about-capability-link svg {

  width: 13px;

}



/* ==========================================================
   WHY DAWN
========================================================== */

.about-why-section {

  background:

    radial-gradient(
      circle at 90% 30%,
      rgba(43,93,150,.09),
      transparent 32%
    ),

    linear-gradient(
      180deg,
      #07111c,
      #05090d
    );

}


.about-why-heading {

  max-width: 790px;

  margin:
    0 auto 48px;

  text-align: center;

}


.about-why-heading
.section-label {

  width: fit-content;

  margin:
    0 auto 16px;

}


.about-why-heading h2 {

  max-width: 760px;

  margin:
    0 auto;

}


.about-why-heading h2 span {

  display: block;

}


.about-why-heading p {

  max-width: 620px;

  margin:
    17px auto 0;

}


.about-why-layout {

  display: grid;

  grid-template-columns:
    .76fr 1fr 1fr;

  gap: 18px;

  align-items: stretch;

}


.about-why-list {

  display: grid;

  gap: 8px;

}


.about-why-list article {

  min-height: 72px;

  padding:
    12px 15px;

  display: grid;

  grid-template-columns:
    42px 1fr;

  gap: 12px;

  align-items: center;

  border-radius: 12px;

  border:
    1px solid
    var(--border);

  background:

    linear-gradient(
      145deg,
      #101c2b,
      #080f16
    );

}


.about-why-list article > div {

  width: 40px;
  height: 40px;

  display: grid;

  place-items: center;

  border-radius: 10px;

  color:
    var(--blue);

  background:
    rgba(105,200,250,.045);

}


.about-why-list svg {

  width: 17px;

}


.about-why-list p {

  color:
    #c7d2db;

  font-size: 11px;

  font-weight: 600;

  line-height: 1.4;

}


.about-why-center {

  position: relative;

  min-height: 470px;

  display: grid;

  place-items: center;

  overflow: hidden;

  border-radius: 18px;

  border:
    1px solid
    var(--border);

  background:

    radial-gradient(
      circle at center,
      rgba(41,111,174,.13),
      transparent 50%
    ),

    #09141f;

}


.why-ring {

  position: absolute;

  left: 50%;
  top: 50%;

  transform:
    translate(-50%,-50%);

  border-radius: 50%;

  border:
    1px solid
    rgba(105,200,250,.12);

}


.why-ring-one {

  width: 330px;
  height: 330px;

}


.why-ring-two {

  width: 245px;
  height: 245px;

  border-color:
    rgba(142,145,255,.13);

}


.why-core {

  position: relative;

  z-index: 3;

  width: 185px;

  text-align: center;

}


.why-core > div {

  width: 62px;
  height: 62px;

  margin:
    0 auto 17px;

  display: grid;

  place-items: center;

  border-radius: 50%;

  color:
    #061018;

  background:

    linear-gradient(
      135deg,
      var(--blue),
      var(--violet)
    );

}


.why-core svg {

  width: 26px;

}


.why-core span {

  display: block;

  color:
    var(--blue);

  font-size: 8px;

  font-weight: 700;

  letter-spacing: 1.2px;

}


.why-core strong {

  display: block;

  margin-top: 7px;

  font-size: 15px;

  line-height: 1.4;

}


.why-point {

  position: absolute;

  z-index: 4;

  padding:
    7px 10px;

  border-radius: 100px;

  color:
    #8fa4b4;

  border:
    1px solid
    rgba(105,200,250,.12);

  background:
    #08131f;

  font-size: 7px;

}


.why-point.point-one {

  top: 12%;
  left: 39%;

}


.why-point.point-two {

  right: 3%;
  top: 32%;

}


.why-point.point-three {

  right: 12%;
  bottom: 13%;

}


.why-point.point-four {

  left: 29%;
  bottom: 9%;

}


.why-point.point-five {

  left: 4%;
  top: 39%;

}



/* DELIVERY */

.about-delivery-card {

  padding: 27px;

  overflow: hidden;

  border-radius: 18px;

  border:
    1px solid
    var(--border);

  background:

    radial-gradient(
      circle at 75% 35%,
      rgba(37,105,166,.12),
      transparent 42%
    ),

    linear-gradient(
      145deg,
      #111f31,
      #07111a
    );

}


.about-delivery-label {

  color:
    var(--blue);

  font-size: 8px;

  font-weight: 700;

  letter-spacing: 1.3px;

}


.about-delivery-card h3 {

  max-width: 360px;

  margin-top: 11px;

  font-size: 22px;

  line-height: 1.25;

}


.delivery-map {

  position: relative;

  min-height: 275px;

  margin-top: 18px;

}


.delivery-map::before {

  content: "";

  position: absolute;

  inset: 25px;

  border-radius: 50%;

  border:
    1px solid
    rgba(105,200,250,.1);

}


.delivery-map-core {

  position: absolute;

  left: 50%;
  top: 50%;

  width: 100px;
  height: 100px;

  transform:
    translate(-50%,-50%);

  display: grid;

  place-items: center;

  border-radius: 50%;

  color:
    var(--blue);

  background:
    rgba(105,200,250,.055);

  border:
    1px solid
    rgba(105,200,250,.16);

}


.delivery-map-core svg {

  width: 35px;

}


.delivery-location {

  position: absolute;

  z-index: 3;

  min-width: 155px;

  padding:
    11px 12px;

  display: flex;

  align-items: center;

  gap: 10px;

  border-radius: 11px;

  border:
    1px solid
    rgba(105,200,250,.13);

  background:
    rgba(7,16,26,.96);

}


.delivery-location.india {

  right: 0;
  top: 35px;

}


.delivery-location.philippines {

  left: 0;
  bottom: 30px;

}


.delivery-location > span {

  width: 33px;
  height: 33px;

  display: grid;

  place-items: center;

  border-radius: 8px;

  color:
    var(--blue);

  background:
    rgba(105,200,250,.05);

}


.delivery-location svg {

  width: 14px;

}


.delivery-location small {

  display: block;

  color:
    var(--blue);

  font-size: 7px;

}


.delivery-location strong {

  display: block;

  margin-top: 2px;

  font-size: 9px;

}


.delivery-note {

  padding: 15px;

  display: grid;

  grid-template-columns:
    35px 1fr;

  gap: 11px;

  align-items: center;

  border-radius: 11px;

  color:
    #8ea0af;

  border:
    1px solid
    rgba(93,217,200,.11);

  background:
    rgba(93,217,200,.025);

}


.delivery-note svg {

  width: 18px;

  color:
    var(--cyan);

}


.delivery-note p {

  font-size: 9px;

  line-height: 1.55;

}



/* ==========================================================
   DIFFERENTIATOR
========================================================== */

.differentiator-section {

  background:
    #05090d;

}


.differentiator-heading {

  max-width: 820px;

  margin-bottom: 48px;

}


.differentiator-heading h2 {

  max-width: 780px;

}


.differentiator-heading h2 span {

  display: block;

}


.differentiator-heading > p {

  max-width: 650px;

  margin-top: 17px;

}


.differentiator-panel {

  display: grid;

  grid-template-columns:
    .58fr 70px 1.42fr;

  gap: 16px;

  align-items: center;

}


.differentiator-traditional,
.differentiator-dawn {

  min-height: 500px;

  padding: 32px;

  border-radius: 19px;

  border:
    1px solid
    var(--border);

}


.differentiator-traditional {

  background:

    linear-gradient(
      145deg,
      #10161e,
      #070b10
    );

}


.differentiator-dawn {

  border-color:
    rgba(105,200,250,.21);

  background:

    radial-gradient(
      circle at 86% 5%,
      rgba(86,79,213,.09),
      transparent 34%
    ),

    linear-gradient(
      145deg,
      #132238,
      #08111c
    );

}


.diff-label {

  color:
    var(--blue);

  font-size: 8px;

  font-weight: 700;

  letter-spacing: 1.3px;

}


.traditional-icon {

  width: 78px;
  height: 78px;

  margin:
    36px auto 0;

  display: grid;

  place-items: center;

  border-radius: 50%;

  color:
    #71808e;

  border:
    1px solid
    rgba(160,175,190,.16);

  background:
    rgba(255,255,255,.02);

}


.traditional-icon svg {

  width: 31px;

}


.differentiator-traditional h3 {

  margin-top: 19px;

  text-align: center;

  color:
    #a8b3bc;

  font-size: 20px;

}


.differentiator-traditional ul {

  margin:
    28px 0 0;

  padding: 0;

  list-style: none;

}


.differentiator-traditional li {

  position: relative;

  padding:
    10px 0 10px 26px;

  color:
    #7f8f9d;

  border-bottom:
    1px solid
    rgba(155,187,218,.05);

  font-size: 10px;

}


.differentiator-traditional
li::before {

  content: "×";

  position: absolute;

  left: 2px;

  color:
    #687887;

  font-weight: 700;

}


.diff-vs {

  width: 54px;
  height: 54px;

  margin: auto;

  display: grid;

  place-items: center;

  border-radius: 50%;

  color:
    var(--blue);

  border:
    1px solid
    rgba(105,200,250,.17);

  background:
    #091827;

  font-size: 9px;

  font-weight: 700;

}


.differentiator-dawn > h3 {

  margin-top: 10px;

  font-size: 23px;

}


.diff-pillars {

  margin-top: 33px;

  display: grid;

  grid-template-columns:
    1fr auto 1fr auto 1fr;

  gap: 10px;

  align-items: center;

}


.diff-pillars article {

  min-height: 260px;

  padding: 19px;

  text-align: center;

  border-radius: 13px;

  border:
    1px solid
    rgba(105,200,250,.09);

  background:
    rgba(255,255,255,.012);

}


.diff-pillar-icon {

  width: 52px;
  height: 52px;

  margin: auto;

  display: grid;

  place-items: center;

  border-radius: 50%;

  color:
    var(--blue);

  border:
    1px solid
    rgba(105,200,250,.17);

  background:
    rgba(105,200,250,.04);

}


.diff-pillar-icon.ai {

  color:
    var(--cyan);

}


.diff-pillar-icon svg {

  width: 21px;

}


.diff-pillars article > span {

  display: block;

  margin-top: 20px;

  color:
    var(--blue);

  font-size: 7px;

  font-weight: 700;

  letter-spacing: 1px;

}


.diff-pillars strong {

  display: block;

  margin-top: 7px;

  font-size: 13px;

}


.diff-pillars p {

  margin-top: 7px;

  color:
    #788d9f;

  font-size: 8px;

  line-height: 1.6;

}


.diff-plus {

  color:
    var(--blue);

  font-size: 22px;

}


.diff-outcomes {

  margin-top: 18px;

  display: grid;

  grid-template-columns:
    repeat(4,1fr);

  gap: 7px;

}


.diff-outcomes span {

  min-height: 53px;

  padding: 8px;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 6px;

  text-align: center;

  border-radius: 9px;

  color:
    #8196a7;

  border:
    1px solid
    rgba(155,187,218,.07);

  background:
    rgba(255,255,255,.01);

  font-size: 7px;

}


.diff-outcomes svg {

  width: 13px;

  color:
    var(--cyan);

}



/* ==========================================================
   OPERATING LINKS
========================================================== */

.operating-service-links {

  margin-top: auto;

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: 12px;

}


.operating-service-links
.operating-link {

  margin-top: 0;

}



/* ==========================================================
   RESPONSIVE
========================================================== */

@media(max-width:1100px) {

  .about-capability-grid {

    grid-template-columns:
      1fr;

  }


  .about-capability-card {

    min-height: 350px;

  }


  .about-why-layout {

    grid-template-columns:
      1fr 1fr;

  }


  .about-why-list {

    grid-column:
      1 / -1;

    grid-template-columns:
      repeat(3,1fr);

  }


  .differentiator-panel {

    grid-template-columns:
      1fr;

  }


  .diff-vs {

    margin:
      5px auto;

  }

}



@media(max-width:768px) {

  .about-hero-secondary {

    font-size: 12px;

  }


  .about-why-layout {

    grid-template-columns:
      1fr;

  }


  .about-why-list {

    grid-template-columns:
      1fr;

  }


  .about-why-center {

    min-height: 420px;

  }


  .diff-pillars {

    grid-template-columns:
      1fr;

  }


  .diff-plus {

    text-align: center;

  }


  .diff-outcomes {

    grid-template-columns:
      repeat(2,1fr);

  }


  .differentiator-traditional,
  .differentiator-dawn {

    min-height: auto;

    padding:
      27px 22px;

  }


  .about-capability-card {

    min-height: auto;

  }


  .about-capability-link {

    margin-top: 30px;

  }


  .operating-service-links {

    margin-top: 28px;

  }

}



@media(max-width:520px) {

  .why-point {

    display: none;

  }


  .about-why-center {

    min-height: 330px;

  }


  .why-ring-one {

    width: 270px;
    height: 270px;

  }


  .why-ring-two {

    width: 200px;
    height: 200px;

  }


  .delivery-location {

    min-width: 135px;

  }


  .diff-outcomes {

    grid-template-columns:
      1fr;

  }

}