/* ================================
   CARD TYPOGRAPHY
   ================================ */

.dc, .dc * { 
  font-family: "Inter Display", "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif; 
}

/* Card title styling */
.dc .dc-card h3{
  font-size: 1.5rem !important;
  font-weight: 500 !important;
  line-height: 1.15;
  letter-spacing: 0;
  margin: 0;
  color: #ffffff;
}

/* Base font */
.dc, .dc *{
  font-family: "Inter Display", "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}

/* ===== Scoped vars ===== */
.dc[data-carousel]{ position: relative; width: 100%; --padX: 16px; --gap: 16px; isolation: isolate; }
@media (min-width: 900px){ .dc[data-carousel]{ --padX: 128px; } }

.dc-viewport{ overflow: hidden; width: 100%; position: relative; }

.dc-track{
  display:flex; align-items:stretch; gap:var(--gap);
  will-change: transform; cursor:grab; touch-action:pan-y; transform:translate3d(0,0,0);
}
.dc-track:active{ cursor:grabbing; }
.dc-spacer{ flex:0 0 calc(var(--padX) - var(--gap)); }
@media (max-width: 899.98px){ .dc-spacer{ flex-basis:max(0px, calc(var(--padX) - var(--gap))); } }

/* Cards */
.dc .dc-card{
  position:relative; flex:0 0 auto;
  width:clamp(315px, 40vw, 516px); height:510px;
  border-radius:20px; overflow:hidden; background:#0f0f10; margin:0 !important;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}
@media (min-width:900px){ .dc .dc-card{ width:392px; height:578px; } }

.dc .dc-card a{ position:relative; display:block; height:100%; color:inherit; text-decoration:none; }
.dc .dc-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.dc .dc-card::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(to top, rgba(0,0,0,.55) 0%, rgba(0,0,0,.2) 45%, rgba(0,0,0,0) 70%);
}

.dc .dc-card-content{
  position:absolute; inset:0; z-index:2;
  display:flex; flex-direction:column; justify-content:space-between;
  padding:10% 16px 16px;
}

.dc .dc-card h3,.dc .dc-card p{ margin:0; color:#fff; text-shadow:none; }
.dc .dc-card p { font:400 .95rem/1.4 "Inter Display", "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif; opacity:.95; }

/* Controls */
.dc-controls{
  margin-top:36px; width:100%; display:flex; justify-content:flex-end; gap:10px;
  padding-right:var(--padX); box-sizing: border-box;
}
.dc-btn{
  width:32px; height:32px; border-radius:9999px; border:0; background:rgba(255,255,255,.10);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  display:inline-flex; align-items:center; justify-content:center;
  cursor:pointer; user-select:none; transition:transform .12s ease, background .2s ease;
  -webkit-appearance:none; appearance:none; color:#9a9a9a; position: relative; z-index: 2;
}
.dc-btn:hover{ background:rgba(255,255,255,.16); transform:translateY(-1px); }
.dc-btn svg{ display:block; width:20px; height:20px; overflow:visible; }
@media (hover: none) and (pointer: coarse){
  .dc-btn{ backdrop-filter:none; -webkit-backdrop-filter:none; background:rgba(255,255,255,.14); }
}

.dc-reveal{
  position:absolute; right:20px; bottom:20px; z-index:3; padding:8px 12px; border-radius:9999px; border:0; cursor:pointer;
  background:rgba(255,255,255,.16); color:#ffffff; font:600 .92rem/1 "Inter Display", "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif; letter-spacing:.2px;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  transition: transform .15s ease, background .2s ease, opacity .2s ease; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
}

/* ===== Modal ===== */
html.dc-no-scroll, body.dc-no-scroll{ overflow: hidden !important; overscroll-behavior: none; }

.dc-modal{
  position: fixed; inset: 0; z-index: 2147483646;
  display: grid; place-items: center; align-items: end; justify-items: center;
  padding: 0; opacity: 1; transition: opacity .0s ease;
}
.dc-modal[aria-hidden="true"]{ opacity: 0; pointer-events: none; }

.dc-modal-backdrop{
  position: fixed; inset: 0; z-index: 0;
  background: none !important;
  background-color: rgba(255, 255, 255, .09) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  backdrop-filter: blur(6px) !important;
  transform: translateZ(0);
  will-change: backdrop-filter;
  touch-action: none;
}

@media (min-width:900px){
  .dc-modal-backdrop{
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
    background-color: rgba(255,255,255,.12) !important;
  }
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  .dc-modal-backdrop{ background-color: rgba(0,0,0,.35) !important; }
}

.dc-modal-panel{
  position: relative; z-index: 2147483647;
  width: min(1196px, 92vw); max-height: 100dvh;
  background: #0f0f10; color: #f3f3f3;
  border-radius: 16px 16px 0 0;
  box-shadow: 0 20px 80px rgba(0,0,0,.55);
  overflow: hidden; display: flex; flex-direction: column;
  transform: translateY(8px); opacity: 0; margin: 0;
}

@media (min-width:900px){
  .dc-modal-panel{
    width: min(1196px, calc(100vw - (var(--padX) * 2)));
    max-height: 100dvh;
    margin: 0;
  }
}

@media (max-width:899.98px){
  .dc-modal{
    align-items: start; justify-items: stretch;
    --mtop: max(48px, calc(env(safe-area-inset-top) * 6));
  }
  .dc-modal-panel{
    width: 100vw; max-width: 100vw;
    margin: var(--mtop) 0 0;
    border-radius: 16px 16px 0 0;
    height: calc(100dvh - var(--mtop));
    max-height: none;
  }
}

.dc-modal[aria-hidden="false"] .dc-modal-panel{ animation: dcModalIn .28s cubic-bezier(.2,.7,.2,1) forwards; }
@keyframes dcModalIn{ from{ transform: translateY(8px) scale(.98); opacity: 0; } to{ transform: translateY(0) scale(1); opacity: 1; } }

.dc-modal .dc-btn{ width: 29px; height: 29px; }
.dc-modal-close{ position:absolute; top:10px; right:10px; width:41px; height:41px; }
@media (min-width:900px){ .dc-modal-close{ width:61.5px; height:61.5px; } }

.dc-scrolltop{ position: absolute; right: 12px; bottom: 12px; opacity: 0; pointer-events: none; transition: opacity .18s ease; }
.dc-scrolltop.is-visible{ opacity: 1; pointer-events: auto; }

/* Modal content */
.dc-modal-body{
  --padTop: 100px;
  padding: var(--padTop) 10px 200px;
  flex: 1 1 auto; min-height: 0; overflow-y: auto;
  -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
}

@media (min-width: 900px){
  .dc-modal-body{ padding-left: 96px; padding-right: 96px; }
}

.dc-modal-body h2, .dc-modal-body h3{ margin: .5rem 0 1rem; }

.dc-modal-body h2{
  color: #ffffff !important;
  position: relative;
  --h2Shift: calc(var(--padTop) * 0.3);
  transform: translateY(calc(-1 * var(--h2Shift)));
  margin-bottom: calc(1rem - var(--h2Shift));
}

.dc-modal-body p, .dc-modal-body ul{ margin: 0 0 1rem; }

.dc-modal-body img{
  display: block; width: 100%; height: auto;
  border-radius: 10px; margin: 1rem 0 2rem;
}

/* Text containers */
.dc-modal-textbox{ background:#191919; padding:32px 36px; border-radius:10px; margin:1rem 0 2rem; }
.dc-modal-textbox p:last-child{ margin-bottom:0; }

@media (max-width: 768px){
  .dc-modal-textbox{ padding: 22px 16px 22px 16px; }
  .dc-apple .dc-modal-textbox{ padding: 22px 16px 22px 16px; }
}

/* CTA */
.dc-apple .cta-wrapper{
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.dc-apple .cta-wrapper .cta-text{
  margin: 0 0 16px 0;
  font-size: 21px;
  line-height: 1.3;
  color: #ffffff;
  font-weight: 500;
  text-align: center;
}

.dc-apple .cta-wrapper .dc-primary-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 355px;
  height: 40px;
  padding: 0 34px;
  border-radius: 9999px;
  border: 1px solid #FFFFFF;
  background: rgba(218, 218, 218, 0.95);
  color: #000000;
  text-decoration: none;
  font: 500 14px/1.1 "Inter Display", "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  letter-spacing: 0;
  white-space: nowrap;
  box-shadow: none;
  transition:
    transform 180ms ease,
    background-color 180ms ease,
    color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
  -webkit-tap-highlight-color: transparent;
  margin: 0 auto;
}

.dc-apple .cta-wrapper .dc-primary-btn:hover,
.dc-apple .cta-wrapper .dc-primary-btn:focus-visible{
  background: rgba(255, 255, 255, 0.10);
  color: #ffffff;
  border-color: #FFFFFF;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
  outline: none;
}

.dc-apple .cta-wrapper .dc-primary-btn:active{
  transform: translateY(0);
  box-shadow: none;
}

@media (max-width: 520px){
  .dc-apple .cta-wrapper{
    margin-top: 32px;
  }

  .dc-apple .cta-wrapper .cta-text{
    font-size: 18px;
    margin-bottom: 14px;
  }

  .dc-apple .cta-wrapper .dc-primary-btn{
    width: 100%;
    max-width: 355px;
    height: 40px;
    padding: 0 24px;
    font-size: 14px;
  }
}



@media (hover: none) and (pointer: coarse){ .dc .dc-card a { pointer-events: none; } }

.dc-modal-body img {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

.dc-apple {
  font-family: "Inter Display", "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

.dc-apple * { box-sizing: border-box; }

/* ===============================
   WRAP (viewport → content)
   =============================== */

.dc-apple .wrap{
  max-width: 920px;
  margin: 0 auto;
  padding: 0 24px;
}

@media (max-width: 768px){
  .dc-apple .wrap{
    padding-left: 1vw !important;
    padding-right: 1vw!important;
  }
}

/* ===============================
   TYPOGRAPHY
   =============================== */

.dc-apple h1{
  color:#fff;
  font-weight:600;
  font-size:37px;
  line-height:1.1;
  letter-spacing:-0.035em;
  margin:0 0 14px 0;
}

.dc-apple .subhead{
  color:#8F8F8F;
  font-weight:500;
  font-size:21px;
  line-height:1.3;
  letter-spacing:-0.01em;
  margin:0 0 4rem 0;
}

.dc-apple h2{
  color:#fff;
  font-weight:600;
  font-size:clamp(1.55rem, 2.2vw, 2.05rem);
  line-height:1.16;
  letter-spacing:-0.02em;
  margin:0 0 0px 0;
}

.dc-apple h4{
  color:#ffffff;
  font-size:19px;
  font-weight:500;
  line-height:1.1;
  letter-spacing:0;
  text-align:center;
  text-transform:none;
  margin:0 0 12px 0;
}

.dc-apple .support{
  color:#BAB8B8;
  font-weight:400;
  font-size:clamp(1rem, 1.2vw, 1.1rem);
  line-height:1.65;
  letter-spacing:-0.01em;
  margin:0 0 24px 0;
}

.dc-modal-body .dc-apple h2{
  transform: none !important;
  margin: 0 0 14px 0 !important;
}

.dc-modal-body .dc-apple p.support{
  margin: 0 0 30px 0 !important;
}

/* ===============================
   LOGOS
   =============================== */

.dc-apple .logos{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  align-items:center;
  margin:0 0 6rem 0;
  opacity:0.95;
}

.dc-apple .logos img{
  height:26px;
  width:auto;
  display:block;
}

/* ===============================
   DEFAULT GRAY CARDS
   =============================== */

.dc-apple .dc-modal-textbox{
  background:#191919;
  border-radius:10px;
  padding:14px 14px;
  margin:0 0 32px 0;
}

@media (max-width: 768px){
  .dc-apple .dc-modal-textbox{
    margin-left:0.2px;
    margin-right:0.2px;
    margin-bottom:20px;
  }
}

.dc-apple .dc-modal-textbox p:last-child{ margin-bottom:0; }

.dc-apple .dc-modal-textbox.step-card{
  position: relative;
  background-image:
    linear-gradient(to bottom, rgba(255,255,255,0.06), rgba(255,255,255,0.00)),
    linear-gradient(135deg, #0b0b0d 0%, #141416 50%, #1c1c1f 100%);
  border-radius: 16px;
  padding: 26px 26px 24px;
  margin: 0 0 32px 0;
  border: 1px solid rgba(255,255,255,0.10);
  background-clip: padding-box;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 18px 40px rgba(0,0,0,0.45);
}

.dc-apple .dc-modal-textbox.step-card .item-title{ color: #ffffff; }
.dc-apple .dc-modal-textbox.step-card .item-body{ color: #BAB8B8; }

/* ===============================
   ITEM TITLE / BODY
   =============================== */

.dc-apple .item-title{
  display:flex;
  align-items:center;
  gap:16px;
  color:#fff;
  font-weight:600;
  font-size:21px;
  line-height:1.1;
  letter-spacing:-0.01em;
  text-transform: capitalize;
  margin:0 0 12px 0;
}

.dc-apple .item-number{
  position:relative;
  width:44px;
  height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:20px;
  background: rgba(0,0,0,0.90);
  color:#ffffff;
  font-size:1.2rem;
  font-weight:600;
  line-height:1;
  flex-shrink:0;
}

.dc-apple .item-number::before{
  content:"";
  position:absolute;
  inset:0;
  padding:1.5px;
  border-radius:inherit;
  background: linear-gradient(135deg, #6ee7f9, #a78bfa, #fbc2eb);
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}

.dc-apple .item-body{
  color:#807E7E;
  font-weight:500;
  font-size:17px;
  line-height:1.35;
  letter-spacing:-0.005em;
  margin:0;
  width:100%;
  max-width:none;
}

/* ===============================
   PACKAGE CHECKLIST
   white hover + smooth 2x-less glow
   =============================== */

.dc-apple .package-checklist{
  position:relative;
  background:#050506;
  border-radius:15px;
  padding:36px 24px 30px;
  margin:20px 0 32px;
  border:1px solid rgba(255,255,255,0.12);
  background-clip:padding-box;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.03),
    0 0 0 rgba(255,255,255,0);
  overflow:hidden;
  will-change: border-color, box-shadow;
  transition:
    border-color 420ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* remove all old pseudo hover border effects */
.dc-apple .package-checklist::before,
.dc-apple .package-checklist::after{
  content:none !important;
}

.dc-apple .package-checklist:hover{
  border-color: rgba(255,255,255,0.95);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.14),
    0 0 0 1px rgba(255,255,255,0.12),
    0 0 42px rgba(255,255,255,0.15),
    0 0 80px rgba(255,255,255,0.09);
}

/* PACKAGE badge */
.dc-apple .package-checklist .package-category{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding: 12px 24px;
  border: 1px solid #2b2b2b;
  border-radius: 10px;
  background: transparent !important;
  color: #d8d8d8 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none !important;
  margin: 0 0 18px !important;
  box-shadow: none !important;
}

/* package title */
.dc-apple .package-checklist .package-title,
.dc-apple .package-checklist .package-title.is-text-outline{
  color:#ffffff;
  background:none;
  -webkit-text-stroke:0;
  -webkit-text-fill-color:#ffffff;
  text-shadow: 0 0 12px rgba(195,220,255,0.12);
  font-weight:600;
  font-size:30px;
  line-height:1.1;
  letter-spacing:-0.02em;
  margin:0;
}

/* editable subtitle under package title */
.dc-apple .package-checklist .package-subtitle{
  display:block;
  margin-top:40px;
  margin-bottom:10px;
  font-size:21px;
  font-weight:500;
  line-height:1.2;
  color:#ffffff;
}


/* description */
.dc-apple .package-checklist .item-body{
  color:#8b8b8f;
  font-size:17px;
  font-weight:500;
  line-height:1.35;
  margin:0 0 14px;
}

/* list area */
.dc-apple .package-checklist ul{
  list-style:none;
  margin:0;
  padding:30px 0 0;
  border-top:1px solid rgba(255,255,255,0.12);
}

.dc-apple .package-checklist li{
  display:flex;
  align-items:flex-start;
  gap:12px;
  color:#f2f2f2;
  font-size:17px;
  font-weight:500;
  line-height:1.35;
  margin-bottom:10px;
}
.dc-apple .package-checklist li:last-child{ margin-bottom:0; }

.dc-apple .package-checklist .check{
  width:auto;
  height:auto;
  min-width:22px;
  display:inline-block;
  background:none;
  border:0;
  border-radius:0;
  box-shadow:none;
  color:#ffffff;
  font-size:1.05rem;
  font-weight:600;
  line-height:1;
  flex-shrink:0;
  transform: translateY(2px);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.dc-apple .package-checklist .check.check-gray{
  color:#999999;
}


/* =====================================
   QUIZ
   ===================================== */

.dc-quiz{
  --hairline: rgba(0,0,0,.10);
  --hairline-soft: rgba(0,0,0,.06);
  --text: rgba(0,0,0,.92);
  --muted: rgba(0,0,0,.60);
}

.dc-quiz-header{
  text-align:center;
  margin: 8px 0 22px;
}
.dc-quiz-header .package-category{
  display:inline-block;
  opacity:1;
  margin-bottom:10px;
  font-size:18px;
  color:#8F8F8F;
  font-weight:500;
}

.dc-quiz-group{
  border: 1px solid var(--hairline);
  border-radius: 20px;
  background: #fff;
  overflow: hidden;
}

.dc-quiz-row{
  position: relative;
  padding: 10px 20px 45px 20px;
  border-top: 1px solid var(--hairline-soft);
  z-index: 0;
}
.dc-quiz-row:first-child{ border-top: 0; }

.dc-quiz-row::before{
  content: "";
  position: absolute;
  top: 15px;
  right: 15px;
  font-size: 25px;
  font-weight: 600;
  line-height: 1;
  color: rgba(255,255,255,1);
  pointer-events: none;
}

.dc-quiz-row:nth-child(1)::before{ content: "1"; }
.dc-quiz-row:nth-child(2)::before{ content: "2"; }
.dc-quiz-row:nth-child(3)::before{ content: "3"; }
.dc-quiz-row:nth-child(4)::before{ content: "4"; }
.dc-quiz-row:nth-child(5)::before{ content: "5"; }

.dc-quiz-eyebrow{
  color: var(--muted);
  margin-bottom: 10px;
}

.dc-quiz-group .item-title{
  color:#fff;
  margin: 0 0 16px;
  font-size:21px;
  font-weight:600;
  line-height:1.1;
  text-transform: none !important;
}
.dc-quiz-group .item-body{
  color:#807E7E;
  font-size:17px;
  font-weight:500;
  line-height:1.35;
}
.dc-quiz-group .item-body + .item-body{ margin-top: 8px; }

/* =====================================
   DARK VARIANT
   ===================================== */

.dc-apple .dc-quiz-group{
  background:#0f0f11;
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 18px 40px rgba(0,0,0,0.6);
}

.dc-apple .dc-quiz-row{
  border-top:1px solid rgba(255,255,255,0.06);
  margin-bottom: 30px;
}

.dc-apple .dc-quiz-header h2{ color:#ffffff; }
.dc-apple .dc-quiz-header .subhead{ color:#8F8F8F; }
.dc-apple .dc-quiz-header .package-category{
  color:#8F8F8F;
  font-size:18px;
  font-weight:500;
}
.dc-apple .dc-quiz-eyebrow{ color:rgba(255,255,255,0.5); }

.dc-apple .dc-quiz-group .item-title{
  color:#ffffff;
  font-size:21px;
  font-weight:600;
  line-height:1.1;
}
.dc-apple .dc-quiz-group .item-body{
  color:#807E7E;
  font-size:17px;
  font-weight:500;
  line-height:1.35;
}

.dc-apple .dc-quiz-row::before{ color: rgba(255,255,255,0.10); }
.dc-quiz-eyebrow{ padding-top: 30px; }

/* =====================================
   Workflow ring diagram
   ===================================== */

.dc-apple .dc-workflow-ring{
  margin: 22px auto 26px;
  max-width: 720px;
}

.dc-apple .dc-workflow-ring svg{
  width: 100%;
  height: auto;
  display: block;
}

.dc-apple .dc-workflow-ring .ring-track{
  fill: none;
  stroke: rgba(255,255,255,0.12);
  stroke-width: 2;
}

.dc-apple .dc-workflow-ring .node circle{
  fill: #ffffff;
  stroke: rgba(15,15,17,1);
  stroke-width: 2;
  paint-order: stroke fill;
}

.dc-apple .dc-workflow-ring .node-num{
  font-size: 18px;
  font-weight: 700;
  fill: #000;
}

.dc-apple .dc-workflow-ring .label-step{
  font-size: 42px;
  font-weight: 600;
  line-height: 1;
  fill: rgba(255,255,255,0.20);
}

.dc-apple .dc-workflow-ring .label-title{
  font-size: 19px;
  font-weight: 500;
  fill: rgba(255,255,255,0.88);
}

.dc-apple .dc-workflow-ring .center-title{
  font-size: 28px;
  font-weight: 700;
  fill: rgba(255,255,255,0.92);
}

.dc-apple .dc-workflow-ring .center-sub{
  font-size: 17px;
  font-weight: 500;
  fill: rgba(255,255,255,0.60);
}

@media (max-width: 520px){
  .dc-apple .dc-workflow-ring{ margin: 16px auto 18px; }
  .dc-apple .dc-workflow-ring .label-step{ font-size: 45px; }
  .dc-apple .dc-workflow-ring .label-title{ font-size: 24px; }
  .dc-apple .dc-workflow-ring .node-num{ font-size: 16px; }
  .dc-apple .dc-workflow-ring .center-title{ font-size: 34px; }
  .dc-apple .dc-workflow-ring .center-sub{ font-size: 25px; }
}

/* ===========================
   STOP TEXT TRUNCATION
   =========================== */

.dc-apple .dc-modal-textbox .item-title,
.dc-apple .dc-modal-textbox .item-title strong,
.dc-apple .dc-modal-textbox .item-body{
  white-space: normal !important;
  text-overflow: clip !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

.dc-apple .dc-modal-textbox .item-title,
.dc-apple .dc-modal-textbox .item-title strong,
.dc-apple .dc-modal-textbox .item-body{
  display: block !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
  -webkit-box-orient: unset !important;
}

.dc-apple .dc-modal-textbox,
.dc-apple .dc-modal-plain,
.dc-apple .dc-quiz,
.dc-apple .dc-workflow,
.dc-apple .wrap{
  overflow: visible !important;
  max-height: none !important;
  height: auto !important;
}

.dc-apple .dc-modal-textbox,
.dc-apple .dc-modal-plain,
.dc-apple .dc-modal-textbox .item-title,
.dc-apple .dc-modal-textbox .item-body{
  min-width: 0 !important;
}

.dc-apple .dc-workflow-ring{ width: 130%; }

@media (max-width: 520px){
  .dc-apple .dc-workflow-ring{
    width: 105%;
    margin-left: -3%;
  }
}

/* =========================================
   STEP styles
   ========================================= */

.dc-apple .dc-modal-textbox.dc-modal-plain .package-category.dc-quiz-eyebrow{
  font-size: 42px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  color: rgba(255,255,255,0.20);
  margin: 0 0 12px;
}

.dc-apple .dc-modal-textbox.dc-modal-plain .item-title{
  font-size: 19px;
  font-weight: 500;
}

.dc-apple .dc-step-big{
  font-size: 42px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  color: rgba(255,255,255,0.20);
  margin: 30px 0 12px;
}

@media (max-width: 520px){
  .dc-apple .dc-step-big{
    font-size: 42px;
    margin-top: 40px;
  }
}

.title-inline{
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}

.dc-apple .dc-modal-textbox.dc-modal-plain .item-title,
.dc-apple .dc-modal-textbox.dc-modal-plain .item-body{
  text-align: left;
}

.dc-apple .mini-package-category{
  margin-top: 0px;
  margin-bottom: -10px !important;
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  font-weight: 700;
  opacity: 0.3;
}

/* ================================
   DC MODAL PLAIN (BASE)
   ================================ */

.dc-apple .dc-modal-plain{
  position: relative;
  background: #0f0f11;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 15px 17px 30px;
  margin: 30px 0;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 18px 40px rgba(0,0,0,0.6);
}

/* =========================================================
   AURORA BORDER OPTIONS
   ========================================================= */

.dc-apple .dc-modal-plain.aurora-a::before,
.dc-apple .dc-modal-plain.aurora-b::before,
.dc-apple .dc-modal-plain.aurora-c::before,
.dc-apple .dc-modal-plain.aurora-d::before{
  content:"";
  position:absolute;
  inset:0;
  padding:1px;
  border-radius:inherit;
  pointer-events:none;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  mix-blend-mode: screen;
}

.dc-apple .dc-modal-plain.aurora-a::before{
  background:
    radial-gradient(260px 160px at 50% -10%, rgba(255,255,255,0.18), transparent 75%),
    radial-gradient(240px 115px at 15% 10%, rgba(110,231,249,0.42), transparent 80%),
    radial-gradient(250px 130px at 70% 2%, rgba(167,139,250,0.64), transparent 72%),
    radial-gradient(180px 200px at 80% 95%, rgba(251,194,235,0.80), transparent 85%);
}

.dc-apple .dc-modal-plain.aurora-b::before{
  background:
    radial-gradient(300px 180px at 65% -15%, rgba(255,255,255,0.22), transparent 75%),
    radial-gradient(210px 120px at 8% 18%, rgba(110,231,249,0.38), transparent 78%),
    radial-gradient(280px 150px at 92% 10%, rgba(167,139,250,0.72), transparent 74%),
    radial-gradient(180px 150px at 88% 92%, rgba(251,194,235,0.68), transparent 82%);
}

.dc-apple .dc-modal-plain.aurora-c::before{
  background:
    radial-gradient(280px 170px at 55% -12%, rgba(255,255,255,0.16), transparent 76%),
    radial-gradient(190px 110px at 12% 12%, rgba(110,231,249,0.36), transparent 78%),
    radial-gradient(320px 140px at 75% 0%, rgba(167,139,250,0.62), transparent 76%),
    radial-gradient(320px 220px at 55% 105%, rgba(251,194,235,0.78), transparent 82%);
}

.dc-apple .dc-modal-plain.aurora-d::before{
  background:
    radial-gradient(280px 160px at 45% -12%, rgba(255,255,255,0.19), transparent 76%),
    radial-gradient(320px 180px at -10% 55%, rgba(110,231,249,0.52), transparent 78%),
    radial-gradient(240px 140px at 95% 25%, rgba(167,139,250,0.52), transparent 76%),
    radial-gradient(220px 180px at 85% 98%, rgba(251,194,235,0.66), transparent 84%);
}