:root {
  --ata-accent: #ff9f01;
  --ata-ink: #10131a;
  --ata-muted: #b5bac6;
  --ata-panel: rgba(21, 23, 30, 0.9);
  --ata-panel-strong: rgba(14, 16, 21, 0.96);
  --ata-border: rgba(255, 159, 1, 0.18);
  --ata-soft-border: rgba(255, 255, 255, 0.1);
}

html {
  background: #0f1117;
}

body {
  text-rendering: geometricPrecision;
}

body.light,
body.dark {
  background:
    radial-gradient(circle at 18% 16%, rgba(255, 159, 1, 0.12), transparent 28%),
    linear-gradient(135deg, #f7f8fb 0%, #ffffff 54%, #eff2f6 100%);
}

body.light {
  --ata-muted: #68707e;
  --ata-panel: rgba(255, 255, 255, 0.92);
  --ata-panel-strong: rgba(246, 248, 251, 0.96);
  --ata-border: rgba(255, 159, 1, 0.26);
  --ata-soft-border: rgba(16, 19, 26, 0.1);
}

body.dark {
  --ata-panel: rgba(27, 29, 36, 0.88);
  --ata-panel-strong: rgba(14, 16, 21, 0.96);
  --ata-border: rgba(255, 255, 255, 0.1);
  --ata-muted: #b5bac6;
  background:
    radial-gradient(circle at 18% 16%, rgba(255, 159, 1, 0.18), transparent 28%),
    linear-gradient(135deg, #0f1117 0%, #171a22 52%, #0c0d11 100%);
}

.yellow .color-block {
  background: linear-gradient(135deg, #ff9f01 0%, #ffbe4d 48%, #11141b 49%, #11141b 100%) !important;
  box-shadow: 22px 0 70px rgba(0, 0, 0, 0.22);
}

.home-details h1 {
  line-height: 1.02;
  max-width: 780px;
}

.home-details h1 span {
  margin-top: 10px;
}

.home-details p {
  color: var(--ata-muted);
  font-size: 17px;
  line-height: 1.85;
  max-width: 720px;
}

.ata-hero-kicker {
  color: var(--ata-accent);
  font: 700 13px/1.2 Poppins, sans-serif;
  letter-spacing: 0;
  margin-bottom: 18px;
  text-transform: uppercase;
}

.ata-proof-strip {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 24px 0 30px;
  max-width: 690px;
  overflow: hidden;
  border: 1px solid rgba(255, 159, 1, 0.2);
  border-radius: 8px;
  background: rgba(255, 159, 1, 0.18);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.24);
}

.ata-proof-strip span {
  background: linear-gradient(180deg, rgba(22, 24, 31, 0.92), rgba(13, 15, 20, 0.94));
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: rgba(255, 255, 255, 0.68);
  display: flex;
  flex-direction: column;
  font: 700 11px/1.35 Open Sans, sans-serif;
  justify-content: center;
  min-height: 74px;
  padding: 14px 18px;
  text-transform: uppercase;
}

.ata-proof-strip strong {
  color: var(--ata-accent);
  font: 800 23px/1 Poppins, sans-serif;
  margin-bottom: 7px;
  text-transform: none;
}

.button {
  box-shadow: 0 14px 30px rgba(255, 159, 1, 0.18);
}

.button .button-text {
  letter-spacing: 0;
}

.header .icon-box {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.title-section h1 {
  letter-spacing: 0;
}

.title-section .title-bg {
  opacity: 0.08;
}

.ata-section-note,
.ata-profile-intro {
  color: var(--ata-muted);
  font-size: 16px;
  line-height: 1.75;
}

.ata-section-note {
  margin: -34px auto 42px;
  max-width: 760px;
  padding: 0 24px;
  text-align: center;
}

.box-stats,
.resume-box li,
.contactform input,
.contactform textarea {
  border-color: var(--ata-border) !important;
}

.box-stats {
  background:
    linear-gradient(145deg, rgba(255, 159, 1, 0.1), transparent 42%),
    linear-gradient(180deg, var(--ata-panel), var(--ata-panel-strong)) !important;
  border: 1px solid var(--ata-border) !important;
  border-radius: 8px;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.22);
}

.box-stats h3 {
  color: var(--ata-accent);
}

.box-stats p {
  color: rgba(255, 255, 255, 0.72) !important;
}

.box-stats p:before {
  background: rgba(255, 255, 255, 0.34) !important;
}

.about-list li,
.about-list .title,
.about-list .value,
.resume-box p,
.resume-box .place,
.custom-span-contact,
.custom-span-contact a {
  color: rgba(255, 255, 255, 0.76) !important;
}

.about-list .value,
.custom-span-contact a {
  color: rgba(255, 255, 255, 0.92) !important;
}

.resume-box li {
  background: transparent !important;
}

.resume-box li .icon {
  box-shadow: 0 8px 18px rgba(255, 159, 1, 0.25);
}

.portfolio .grid figure,
.portfolio .grid li,
.portfolio .slideshow figure {
  border-radius: 8px !important;
  overflow: hidden;
}

.portfolio .grid img,
.portfolio .slideshow img {
  transform: scale(1);
  transition: transform 0.45s ease, filter 0.45s ease;
}

.portfolio .grid li:hover img,
.portfolio .grid figure:hover img {
  filter: saturate(1.12) contrast(1.05);
  transform: scale(1.045);
}

.portfolio .slideshow figcaption h3,
.portfolio .grid figcaption h3 {
  letter-spacing: 0;
}

.contact .custom-title {
  line-height: 1.25;
}

.contactform input,
.contactform textarea {
  background: var(--ata-panel-strong) !important;
  color: rgba(255, 255, 255, 0.9) !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
}

.contactform input::placeholder,
.contactform textarea::placeholder {
  color: rgba(255, 255, 255, 0.46) !important;
}

body.light .ata-profile-intro,
body.light .ata-section-note,
body.light .home-details p {
  color: #68707e !important;
}

body.light .tab-panel_list,
body.light .tab-panel,
body.light .home,
body.light .about,
body.light .portfolio,
body.light .contact,
body.light .blog,
body.light .main-content,
body.light .box_inner {
  background:
    radial-gradient(circle at 14% 10%, rgba(255, 159, 1, 0.13), transparent 24%),
    linear-gradient(135deg, #fbfaf7 0%, #ffffff 54%, #eef1f5 100%) !important;
  color: #2d3138 !important;
}

body.light .title-section h1,
body.light .custom-title,
body.light .resume-box h5,
body.light .c100 + h6 {
  color: #5f6269 !important;
}

body.light .title-section h1 span,
body.light .resume-box h5 span,
body.light .box-stats h3 {
  color: var(--ata-accent) !important;
}

body.light .custom-title,
body.light .about-list li,
body.light .about-list .title,
body.light .resume-box p,
body.light .resume-box .place,
body.light .custom-span-contact,
body.light .custom-span-contact a {
  color: #5f6672 !important;
}

body.light .about-list .value,
body.light .custom-span-contact a {
  color: #2d3138 !important;
}

body.light .box-stats {
  background:
    linear-gradient(145deg, rgba(255, 159, 1, 0.12), transparent 45%),
    linear-gradient(180deg, #ffffff, #f5f6f8) !important;
  box-shadow: 0 18px 42px rgba(20, 23, 31, 0.1);
}

body.light .box-stats p {
  color: #6a707a !important;
}

body.light .box-stats p:before {
  background: rgba(16, 19, 26, 0.28) !important;
}

body.light .separator {
  border-top-color: rgba(16, 19, 26, 0.12) !important;
}

body.light .resume-box li {
  color: #5f6672 !important;
}

body.light .resume-box li:after {
  border-left-color: rgba(16, 19, 26, 0.16) !important;
}

body.light .c100 {
  background-color: rgba(16, 19, 26, 0.1) !important;
}

body.light .c100 > span {
  color: #5f6269 !important;
}

body.light .contactform input,
body.light .contactform textarea {
  background: #ffffff !important;
  color: #2d3138 !important;
  box-shadow: 0 14px 34px rgba(20, 23, 31, 0.08);
}

body.light .contactform input::placeholder,
body.light .contactform textarea::placeholder {
  color: #848b97 !important;
}

.social li a {
  box-shadow: 0 10px 24px rgba(15, 17, 23, 0.1);
}

@media (max-width: 991px) {
  .home-details {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  .ata-proof-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-left: auto;
    margin-right: auto;
  }

  .ata-proof-strip span {
    min-height: auto;
    padding: 13px 10px;
    text-align: center;
  }

  .ata-proof-strip strong {
    font-size: 21px;
  }

  .ata-section-note {
    margin-top: -18px;
    text-align: left;
  }
}

@media (max-width: 576px) {
  .home-details p,
  .ata-section-note,
  .ata-profile-intro {
    font-size: 15px;
  }

  .ata-hero-kicker {
    font-size: 12px;
  }

  .ata-proof-strip {
    grid-template-columns: 1fr;
    gap: 1px;
  }

  .ata-proof-strip span {
    align-items: center;
    min-height: 58px;
  }
}