/* Desafio 21 Dias — isolated front-end styles for GeneratePress and WordPress. */

body.d21ra-sales-page .site.grid-container,
body.d21ra-sales-page .site-content.grid-container,
body.d21ra-sales-page .content-area,
body.d21ra-sales-page .site-main,
body.d21ra-sales-page article.post,
body.d21ra-sales-page article.post > .inside-article {
  max-width: none;
  width: 100%;
}

body.d21ra-sales-page .site-content,
body.d21ra-sales-page article.post > .inside-article {
  padding: 0 !important;
}

body.d21ra-sales-page .site-main,
body.d21ra-sales-page .entry-content {
  margin: 0 !important;
}

body.d21ra-sales-page article.post > .inside-article > .entry-header,
body.d21ra-sales-page article.post > .inside-article > .entry-meta,
body.d21ra-sales-page article.post > .inside-article > footer.entry-meta,
body.d21ra-sales-page .comments-area,
body.d21ra-sales-page .page-header {
  display: none !important;
}

.d21ra,
.d21ra * {
  box-sizing: border-box;
}

.d21ra {
  --d21ra-plum-950: #211128;
  --d21ra-plum-900: #2b1732;
  --d21ra-plum-800: #43243e;
  --d21ra-plum-700: #63364f;
  --d21ra-rose: #c77c83;
  --d21ra-rose-dark: #a95f6b;
  --d21ra-coral: #e2a08a;
  --d21ra-gold: #d3aa70;
  --d21ra-sage: #829b91;
  --d21ra-ink: #39263a;
  --d21ra-muted: #6f5d6d;
  --d21ra-line: #e4d6cf;
  --d21ra-cream: #fbf5ee;
  --d21ra-rosewash: #f4e5e1;
  --d21ra-white: #fff;
  position: relative;
  left: 50%;
  width: 100vw;
  margin-left: -50vw;
  overflow: clip;
  color: var(--d21ra-ink);
  background: var(--d21ra-white);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 18px;
  line-height: 1.72;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.d21ra img {
  display: block;
  max-width: 100%;
  height: auto;
}

.d21ra a {
  color: #8f4358;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.d21ra a:hover {
  color: #642c43;
}

.d21ra a:focus-visible,
.d21ra summary:focus-visible {
  outline: 3px solid #e8be7f;
  outline-offset: 4px;
}

.d21ra h1,
.d21ra h2,
.d21ra h3,
.d21ra p,
.d21ra ul,
.d21ra ol,
.d21ra dl,
.d21ra figure {
  margin-top: 0;
}

.d21ra h1,
.d21ra h2,
.d21ra h3 {
  color: inherit;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.08;
}

.d21ra h1 {
  max-width: 900px;
  margin-bottom: 28px;
  color: #fffaf5;
  font-size: clamp(2.55rem, 5.1vw, 5.15rem);
}

.d21ra h2 {
  margin-bottom: 25px;
  font-size: clamp(2rem, 3.65vw, 3.55rem);
}

.d21ra h3 {
  margin-bottom: 13px;
  font-size: clamp(1.28rem, 2vw, 1.65rem);
}

.d21ra p {
  margin-bottom: 21px;
}

.d21ra section[id] {
  scroll-margin-top: 36px;
}

.d21ra-shell {
  width: min(1180px, calc(100% - 44px));
  margin-inline: auto;
}

.d21ra-reading {
  max-width: 850px;
}

.d21ra-skip {
  position: fixed;
  z-index: 10003;
  top: 12px;
  left: 12px;
  padding: 12px 18px;
  transform: translateY(-180%);
  border-radius: 9px;
  color: #fff;
  background: var(--d21ra-plum-950);
  font-weight: 800;
  text-decoration: none;
  transition: transform 180ms ease;
}

.d21ra-skip:focus {
  transform: translateY(0);
}

.d21ra-progress {
  position: fixed;
  z-index: 10002;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  pointer-events: none;
  background: rgb(255 255 255 / 12%);
}

.d21ra-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, var(--d21ra-coral), var(--d21ra-gold));
  box-shadow: 0 0 16px rgb(226 160 138 / 60%);
}

.d21ra-hero {
  position: relative;
  display: grid;
  min-height: min(860px, 93vh);
  isolation: isolate;
  align-items: center;
  overflow: hidden;
  color: #eadbdc;
  background: var(--d21ra-plum-950);
}

.d21ra-hero__media,
.d21ra-hero__media img,
.d21ra-hero__shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.d21ra-hero__media {
  z-index: -3;
}

.d21ra-hero__media img {
  object-fit: cover;
  object-position: center;
}

.d21ra-hero__shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgb(31 15 38 / 98%) 0%, rgb(40 19 44 / 91%) 46%, rgb(42 20 44 / 48%) 72%, rgb(42 20 44 / 15%) 100%),
    linear-gradient(0deg, rgb(29 14 35 / 72%), transparent 50%);
}

.d21ra-hero__content {
  padding-block: 110px 100px;
}

.d21ra-eyebrow,
.d21ra-kicker {
  margin-bottom: 18px !important;
  color: var(--d21ra-rose-dark);
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.17em;
  line-height: 1.35;
  text-transform: uppercase;
}

.d21ra-hero .d21ra-eyebrow,
.d21ra-section--plum .d21ra-kicker,
.d21ra-section--final .d21ra-kicker {
  color: #f0bb9e;
}

.d21ra-lead {
  max-width: 750px;
  margin-bottom: 30px !important;
  color: #e3d3d5;
  font-size: clamp(1.08rem, 1.75vw, 1.36rem);
  line-height: 1.6;
}

.d21ra-lead strong {
  color: #fff;
}

.d21ra-proof {
  display: flex;
  max-width: 820px;
  margin: 0 0 34px;
  padding: 0;
  gap: 10px;
  flex-wrap: wrap;
  list-style: none;
}

.d21ra-proof li {
  padding: 10px 16px;
  border: 1px solid rgb(255 255 255 / 19%);
  border-radius: 999px;
  color: #f1e7e6;
  background: rgb(255 255 255 / 8%);
  font-size: 0.86rem;
  backdrop-filter: blur(9px);
}

.d21ra-proof strong {
  color: #f1c28e;
}

.d21ra-button {
  display: inline-flex;
  min-height: 58px;
  padding: 16px 25px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: 0;
  border-radius: 12px;
  font-size: 0.98rem;
  font-weight: 850;
  line-height: 1.25;
  text-align: center;
  text-decoration: none !important;
  box-shadow: 0 15px 32px rgb(48 22 38 / 18%);
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.d21ra-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 19px 38px rgb(48 22 38 / 25%);
}

.d21ra-button--primary {
  color: #281529 !important;
  background: linear-gradient(135deg, #efb28f, #d5aa70);
}

.d21ra-button--primary:hover {
  background: linear-gradient(135deg, #f4c19e, #e2ba7c);
}

.d21ra-button--dark {
  color: #fff !important;
  background: var(--d21ra-plum-900);
}

.d21ra-button--block {
  width: 100%;
}

.d21ra-microcopy {
  max-width: 610px;
  margin: 17px 0 0 !important;
  color: #cbbabe;
  font-size: 0.78rem;
  line-height: 1.55;
}

.d21ra-toc {
  border-bottom: 1px solid var(--d21ra-line);
  background: #fffaf7;
}

.d21ra-toc .d21ra-shell {
  display: flex;
  min-height: 78px;
  align-items: center;
  gap: 28px;
}

.d21ra-toc__title {
  margin: 0 !important;
  color: var(--d21ra-plum-800);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  white-space: nowrap;
}

.d21ra-toc ol {
  display: flex;
  margin: 0;
  padding: 0;
  gap: 9px 20px;
  flex-wrap: wrap;
  list-style: none;
}

.d21ra-toc a {
  color: #675264;
  font-size: 0.83rem;
  font-weight: 700;
  text-decoration: none;
}

.d21ra-toc a:hover {
  color: var(--d21ra-rose-dark);
}

.d21ra-section {
  position: relative;
  padding-block: clamp(76px, 9vw, 124px);
  background: var(--d21ra-white);
}

.d21ra-section--light {
  background: var(--d21ra-cream);
}

.d21ra-section--rose {
  background: var(--d21ra-rosewash);
}

.d21ra-section--sage {
  background: #e8efeb;
}

.d21ra-section--plum,
.d21ra-section--final {
  color: #eadfe1;
  background:
    radial-gradient(circle at 92% 10%, rgb(199 124 131 / 22%), transparent 35%),
    var(--d21ra-plum-900);
}

.d21ra-section--plum h2,
.d21ra-section--plum h3,
.d21ra-section--final h2 {
  color: #fff9f5;
}

.d21ra-section--plum .d21ra-reading,
.d21ra-section--final .d21ra-reading {
  margin-inline: auto;
}

.d21ra-answer {
  margin: 32px 0;
  padding: 27px 29px;
  border-left: 5px solid var(--d21ra-rose);
  border-radius: 0 16px 16px 0;
  background: #fff;
  box-shadow: 0 14px 38px rgb(66 37 58 / 8%);
}

.d21ra-answer p {
  margin: 0;
}

.d21ra-checks {
  display: grid;
  margin: 31px 0 0;
  padding: 0;
  gap: 13px;
  list-style: none;
}

.d21ra-checks li {
  position: relative;
  padding-left: 35px;
}

.d21ra-checks li::before {
  position: absolute;
  top: 0.08em;
  left: 0;
  display: grid;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  place-items: center;
  color: #fff;
  background: var(--d21ra-sage);
  content: "✓";
  font-size: 0.75rem;
  font-weight: 900;
}

.d21ra-grid {
  display: grid;
  align-items: center;
  gap: clamp(40px, 7vw, 90px);
}

.d21ra-grid--content {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 370px);
  align-items: start;
}

.d21ra-grid--visual {
  grid-template-columns: minmax(0, 1.03fr) minmax(0, 0.97fr);
}

.d21ra-grid--visual > div:first-child {
  overflow: hidden;
  border: 1px solid var(--d21ra-line);
  border-radius: 28px;
  box-shadow: 0 24px 65px rgb(70 38 57 / 16%);
}

.d21ra-factbox,
.d21ra-sources {
  padding: 29px;
  border: 1px solid var(--d21ra-line);
  border-radius: 20px;
  background: var(--d21ra-cream);
  box-shadow: 0 18px 52px rgb(66 37 58 / 9%);
}

.d21ra-factbox__title,
.d21ra-buybox__label {
  margin-bottom: 20px !important;
  color: var(--d21ra-rose-dark);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.d21ra-factbox dl {
  margin-bottom: 23px;
}

.d21ra-factbox dl div {
  display: grid;
  padding: 12px 0;
  border-bottom: 1px solid var(--d21ra-line);
  grid-template-columns: 1fr 1.15fr;
  gap: 18px;
}

.d21ra-factbox dt {
  color: var(--d21ra-muted);
  font-size: 0.82rem;
}

.d21ra-factbox dd {
  margin: 0;
  font-size: 0.86rem;
  font-weight: 750;
  text-align: right;
}

.d21ra-factbox a,
.d21ra-sources a {
  font-size: 0.85rem;
  font-weight: 800;
}

.d21ra-quote {
  margin: 38px 0 0;
  padding: 27px 30px;
  border: 1px solid rgb(255 255 255 / 17%);
  border-radius: 18px;
  background: rgb(255 255 255 / 7%);
}

.d21ra-quote p {
  margin: 0;
  color: #f2e7e4;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.28rem;
  line-height: 1.55;
}

.d21ra-cards {
  display: grid;
  margin: 43px 0 30px;
  gap: 18px;
}

.d21ra-cards--four {
  grid-template-columns: repeat(4, 1fr);
}

.d21ra-cards article {
  padding: 27px;
  border: 1px solid var(--d21ra-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 15px 42px rgb(67 36 62 / 7%);
}

.d21ra-cards article > span {
  display: inline-block;
  margin-bottom: 27px;
  color: var(--d21ra-rose-dark);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.d21ra-cards p {
  margin: 0;
  color: var(--d21ra-muted);
  font-size: 0.9rem;
}

.d21ra-media {
  margin: 42px 0 0;
}

.d21ra-media picture {
  display: block;
  overflow: hidden;
  border-radius: 27px;
  box-shadow: 0 24px 65px rgb(65 34 56 / 17%);
}

.d21ra-media figcaption {
  margin-top: 13px;
  color: var(--d21ra-muted);
  font-size: 0.78rem;
  line-height: 1.5;
  text-align: center;
}

.d21ra-stage-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.d21ra-stage {
  padding: clamp(27px, 3.2vw, 40px);
  border: 1px solid var(--d21ra-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 18px 50px rgb(66 36 57 / 9%);
}

.d21ra-stage__number {
  display: grid;
  width: 52px;
  height: 52px;
  margin-bottom: 29px;
  border-radius: 50%;
  place-items: center;
  color: #fff;
  background: var(--d21ra-rose);
  font-size: 0.82rem;
  font-weight: 900;
}

.d21ra-stage:nth-child(2) .d21ra-stage__number {
  background: var(--d21ra-coral);
}

.d21ra-stage:nth-child(3) .d21ra-stage__number {
  background: var(--d21ra-sage);
}

.d21ra-stage p {
  color: var(--d21ra-muted);
  font-size: 0.93rem;
}

.d21ra-cta-band {
  display: grid;
  margin-top: 42px;
  padding: 34px 39px;
  border-radius: 22px;
  align-items: center;
  grid-template-columns: 1fr auto;
  gap: 30px;
  background: linear-gradient(120deg, #f2dcd3, #e8c2b7);
}

.d21ra-cta-band h2 {
  margin-bottom: 8px;
  font-size: clamp(1.7rem, 2.6vw, 2.65rem);
}

.d21ra-cta-band p:last-child {
  margin-bottom: 0;
}

.d21ra-steps {
  display: grid;
  margin-top: 42px;
  gap: 15px;
}

.d21ra-steps article {
  display: grid;
  padding: 24px 26px;
  border: 1px solid var(--d21ra-line);
  border-radius: 17px;
  align-items: start;
  grid-template-columns: 50px 250px 1fr;
  gap: 20px;
}

.d21ra-steps article > span {
  display: grid;
  width: 39px;
  height: 39px;
  border-radius: 50%;
  place-items: center;
  color: #fff;
  background: var(--d21ra-plum-700);
  font-weight: 900;
}

.d21ra-steps h3,
.d21ra-steps p {
  margin: 0;
}

.d21ra-steps p {
  color: var(--d21ra-muted);
  font-size: 0.91rem;
}

.d21ra-sources h3 {
  margin-bottom: 19px;
}

.d21ra-sources ul {
  margin: 0 0 23px;
  padding-left: 20px;
}

.d21ra-sources li {
  margin-bottom: 12px;
}

.d21ra-sources p {
  margin: 0;
  color: var(--d21ra-muted);
  font-size: 0.78rem;
}

.d21ra-notice {
  margin-top: 32px;
  padding: 28px 30px;
  border: 1px solid #afc1b8;
  border-left: 6px solid var(--d21ra-sage);
  border-radius: 0 17px 17px 0;
  background: #fff;
}

.d21ra-notice h3 {
  margin-bottom: 11px;
}

.d21ra-notice p {
  margin: 0;
}

.d21ra-offer {
  display: grid;
  padding: clamp(35px, 5vw, 65px);
  border-radius: 30px;
  grid-template-columns: 1fr minmax(285px, 370px);
  gap: clamp(40px, 7vw, 80px);
  color: #ecdee2;
  background:
    radial-gradient(circle at 100% 0%, rgb(199 124 131 / 30%), transparent 42%),
    var(--d21ra-plum-900);
  box-shadow: 0 28px 75px rgb(47 24 42 / 22%);
}

.d21ra-offer h2 {
  color: #fff9f5;
}

.d21ra-offer .d21ra-checks li::before {
  background: var(--d21ra-rose);
}

.d21ra-buybox {
  padding: 30px;
  border: 1px solid rgb(255 255 255 / 18%);
  border-radius: 22px;
  background: rgb(255 255 255 / 9%);
  backdrop-filter: blur(10px);
}

.d21ra-buybox__label {
  color: #edc296;
}

.d21ra-price {
  margin-bottom: 6px !important;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.8rem, 5vw, 4.3rem);
  font-weight: 700;
  line-height: 1;
}

.d21ra-price small {
  display: block;
  margin-bottom: 7px;
  color: #d7c2c8;
  font-family: Inter, sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
}

.d21ra-installments {
  margin-bottom: 27px !important;
  color: #decad0;
  font-size: 0.85rem;
}

.d21ra-buybox > p:last-child {
  margin: 18px 0 0;
  color: #d5c2c7;
  font-size: 0.76rem;
  line-height: 1.5;
}

.d21ra-faq {
  display: grid;
  margin-top: 39px;
  gap: 12px;
}

.d21ra-faq > h3 {
  margin: 25px 0 4px;
}

.d21ra-faq details {
  overflow: hidden;
  border: 1px solid var(--d21ra-line);
  border-radius: 14px;
  background: #fff;
}

.d21ra-faq summary {
  position: relative;
  padding: 21px 58px 21px 23px;
  cursor: pointer;
  font-weight: 800;
  list-style: none;
}

.d21ra-faq summary::-webkit-details-marker {
  display: none;
}

.d21ra-faq summary::after {
  position: absolute;
  top: 50%;
  right: 22px;
  width: 24px;
  height: 24px;
  transform: translateY(-50%);
  border-radius: 50%;
  color: #fff;
  background: var(--d21ra-rose);
  content: "+";
  font-size: 1.05rem;
  font-weight: 500;
  line-height: 22px;
  text-align: center;
}

.d21ra-faq details[open] summary::after {
  content: "−";
}

.d21ra-faq details[open] summary {
  color: var(--d21ra-rose-dark);
  background: var(--d21ra-cream);
}

.d21ra-faq details p {
  margin: 0;
  padding: 0 23px 23px;
  color: var(--d21ra-muted);
  font-size: 0.93rem;
}

.d21ra-center {
  text-align: center;
}

.d21ra-center .d21ra-microcopy {
  margin-inline: auto !important;
}

.d21ra-internal-links {
  display: flex;
  margin-top: 34px;
  justify-content: center;
  gap: 15px 25px;
  flex-wrap: wrap;
}

.d21ra-internal-links a {
  color: #ecd3d0;
  font-size: 0.82rem;
}

.d21ra-sticky {
  position: fixed;
  z-index: 10001;
  right: 16px;
  bottom: 16px;
  display: none;
  padding: 9px 9px 9px 17px;
  border: 1px solid rgb(255 255 255 / 15%);
  border-radius: 15px;
  align-items: center;
  gap: 16px;
  color: #fff;
  background: rgb(37 18 44 / 94%);
  box-shadow: 0 16px 40px rgb(29 14 35 / 38%);
  backdrop-filter: blur(10px);
}

.d21ra-sticky span {
  font-size: 0.76rem;
  font-weight: 750;
}

.d21ra-sticky a {
  padding: 10px 17px;
  border-radius: 9px;
  color: #2b1830;
  background: linear-gradient(135deg, #edac8c, #d6ac71);
  font-size: 0.79rem;
  font-weight: 900;
  text-decoration: none;
}

@media (max-width: 1000px) {
  .d21ra-grid--content,
  .d21ra-grid--visual,
  .d21ra-offer {
    grid-template-columns: 1fr;
  }

  .d21ra-factbox,
  .d21ra-sources,
  .d21ra-buybox {
    max-width: 610px;
  }

  .d21ra-cards--four {
    grid-template-columns: repeat(2, 1fr);
  }

  .d21ra-stage-grid {
    grid-template-columns: 1fr;
  }

  .d21ra-stage {
    display: grid;
    grid-template-columns: 70px 1fr;
  }

  .d21ra-stage__number {
    grid-row: 1 / span 3;
  }

  .d21ra-stage h3,
  .d21ra-stage p {
    grid-column: 2;
  }

  .d21ra-steps article {
    grid-template-columns: 50px 1fr;
  }

  .d21ra-steps p {
    grid-column: 2;
  }
}

@media (max-width: 760px) {
  .d21ra {
    font-size: 17px;
  }

  .d21ra-shell {
    width: min(100% - 30px, 1180px);
  }

  .d21ra-hero {
    min-height: 760px;
  }

  .d21ra-hero__media img {
    object-position: 64% center;
  }

  .d21ra-hero__shade {
    background: linear-gradient(90deg, rgb(31 15 38 / 97%), rgb(40 19 44 / 76%));
  }

  .d21ra-hero__content {
    padding-block: 82px 74px;
  }

  .d21ra-toc .d21ra-shell {
    display: block;
    padding-block: 19px;
  }

  .d21ra-toc__title {
    margin-bottom: 9px !important;
  }

  .d21ra-cards--four {
    grid-template-columns: 1fr;
  }

  .d21ra-stage {
    display: block;
  }

  .d21ra-stage h3,
  .d21ra-stage p {
    grid-column: auto;
  }

  .d21ra-cta-band {
    grid-template-columns: 1fr;
  }

  .d21ra-steps article {
    display: block;
  }

  .d21ra-steps article > span {
    margin-bottom: 16px;
  }

  .d21ra-steps h3 {
    margin-bottom: 9px;
  }

  .d21ra-offer {
    width: calc(100% - 20px);
    padding: 29px 23px;
  }

  .d21ra-sticky {
    display: flex;
  }
}

@media (max-width: 430px) {
  .d21ra h1 {
    font-size: 2.35rem;
  }

  .d21ra-proof {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .d21ra-proof li:last-child {
    grid-column: 1 / -1;
  }

  .d21ra-button {
    width: 100%;
  }

  .d21ra-sticky {
    right: 9px;
    bottom: 9px;
    left: 9px;
    justify-content: space-between;
  }

  .d21ra-factbox dl div {
    display: block;
  }

  .d21ra-factbox dd {
    margin-top: 4px;
    text-align: left;
  }
}

@media (prefers-reduced-motion: reduce) {
  .d21ra *,
  .d21ra *::before,
  .d21ra *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

@media print {
  .d21ra-progress,
  .d21ra-sticky,
  .d21ra-button,
  .d21ra-toc {
    display: none !important;
  }

  .d21ra,
  .d21ra-section,
  .d21ra-section--plum,
  .d21ra-section--final,
  .d21ra-offer {
    color: #222 !important;
    background: #fff !important;
  }
}