﻿/* --------------------------------------------------------------------------
   SECTION 3 — Strategic priorities (numbered editorial list)
   Big ghost serif numeral, red italic title overlapping it, body,
   bold lead line and a red-square bullet list.
   -------------------------------------------------------------------------- */

:root {
    --bg-pos: 40% 35%;
    --deg: 302deg;
}

#ats-section {
    position: relative;
    background: transparent conic-gradient(from var(--deg) at var(--bg-pos), #ffffff 0.00%, #ffffff 15%, #FFFFFF 35%, #ffffff 55%, #E0E0E0 62%, #230506 72%, #2C0809 82%, #601F20 90.81%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
}

.ats-center-circle {
    background-color: #ffffff7a;
    backdrop-filter: blur(10px);
    border-radius: 50%;
    position: absolute;
    left: 40%;
    top: 30%;
    transform: translate(-50%);
    width: clamp(60px,12vw,180px);
    height: clamp(60px,12vw,180px);
    padding: clamp(10px,1.5vw,30px);
}

@media (max-width:992px) {
    :root { --bg-pos: 30% 35%; }
    .ats-center-circle { left: 30%; top: 30%;}
    #ats-section {
        background: transparent conic-gradient(from 329deg at var(--bg-pos), #ffffff 0.00%, #ffffff 15%, #FFFFFF 35%, #ffffff 40%, #E0E0E0 58%, #230506 65%, #2C0809 72%, #601F20 90.81%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
    }
}
@media (max-width:768px) {
    :root { --bg-pos: 20% 32%;--deg:339deg; }
    .ats-center-circle { left: 20%; top: 30%;}

}
@media (max-width:576px) {
    #ats-section {
        background: transparent conic-gradient(from 354deg at var(--bg-pos), #ffffff 0.00%, #ffffff 15%, #FFFFFF 35%, #ffffff 40%, #E0E0E0 52%, #230506 60%, #2C0809 72%, #601F20 90.81%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
    }
}


.ats-logo-wrapper {
    border-radius: 50%;
    background-color: var(--neutral-E0E0E0);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: clamp(10px,1.5vw,30px);
}
.ats-logo-wrapper svg{
    width:100%;
    height:100%;
}

.priority-wrapper {
    margin-top: 32px;
}

@media (min-width:992px){
    .priority-wrapper {
        margin-top: -80px;
    }
}
@media (min-width:767px){
    .priority-wrapper {
        margin-top: -60px;
    }
}

.priority + .priority {
    margin-top: var(--section-sm);
}

.priority__head {

  margin-bottom: var(--space-4);
  position:relative;
}

.priority__num {
    font-family: var(--font-display);
    font-style: italic;
    font-weight: var(--fw-bold);
    font-size: clamp(40px,6.3vw,120px);
    line-height: 0.9;
    color: var(--neutral-A3A3A3);
    user-select: none;
    position: absolute;
    top: 50%;
    left: calc(-1 * clamp(30px,4vw,70px));
    transform: translateY(-65%);
}

.priority__title {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: var(--fw-bold);
  font-size: var(--df-text-fs-28);
  color: var(--red-D11019);
}

.priority__text {
  font-size: var(--df-text-fs-18);
  color: var(--neutral-3D3D3D);
  margin: 0;
}

.priority__lead {
  font-weight: var(--fw-bold);
  font-size: var(--df-text-fs-18);
  color: var(--neutral-1A1818);
  margin: var(--space-4) 0 var(--space-3);
}

.priority__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.priority__list li {
  position: relative;
  padding-left: var(--space-5);
  font-size: var(--df-text-fs-18);
  color: var(--neutral-3D3D3D);
}

.priority__list li + li {
  margin-top: var(--space-3);
}

.priority__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.5em;
  height: 0.5em;
  background: var(--red-D11019);
  border-radius: 50%;
}