:root {
  --red: #e12744;
  --teal: #008481;
  --purple: #76122a;
  --pink: #cd3a8e;
  --orange: #f3744a;
  --ink: #141719;
  --muted: #555d60;
  --line: #e4e1e2;
  --paper: #ffffff;
  --wash: #f8f6f5;
  --gradient: linear-gradient(135deg, #76122a 0%, #a12262 34%, #cd3a8e 58%, #e12744 82%, #f3744a 100%);
  --shadow: 0 20px 52px rgba(54, 18, 38, 0.12);
}

body {
  background: #f7f5f4;
  color: var(--ink);
}

.site-header {
  color: var(--ink);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 8px 30px rgba(33, 20, 26, 0.09);
  backdrop-filter: blur(16px);
}

.site-header::before {
  display: none;
}

.header-inner {
  min-height: 96px;
}

.header-brand img {
  width: 184px;
}

.header-slogan {
  color: #76122a;
}

.header-apply {
  border-color: var(--red);
  color: #fff;
  background: var(--red);
}

.header-apply:hover,
.header-apply:focus-visible {
  color: #fff;
  background: #b71532;
}

.journey-shell {
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.96);
}

.journey-nav a {
  color: #62686a;
}

.journey-nav a svg,
.journey-nav a .dirham-icon {
  color: var(--red);
}

.journey-nav a:hover,
.journey-nav a:focus-visible,
.journey-nav a.is-active,
.journey-nav a[aria-current="location"] {
  color: #76122a;
  background: #fff0f1;
}

.journey-nav a::after,
.reading-progress span {
  background: var(--gradient);
  box-shadow: none;
}

.reading-progress {
  background: #f1e9eb;
}

.hero {
  width: min(calc(100% - 48px), 1400px);
  margin: 32px auto 0;
  overflow: hidden;
  border-radius: 26px;
  box-shadow: 0 26px 70px rgba(54, 18, 38, 0.16);
}

.hero-video {
  background:
    linear-gradient(180deg, rgba(31, 12, 22, 0.18), rgba(31, 12, 22, 0.82)),
    url("assets/journey-start-classes.webp") center / cover;
}

.hero-video-frame {
  border: 6px solid rgba(255, 255, 255, 0.96);
  box-shadow: 0 20px 52px rgba(22, 8, 15, 0.34);
}

.hero-video > p {
  color: #fff;
}

.hero-panel {
  background: var(--gradient);
}

.hero-panel::after {
  background:
    radial-gradient(circle at 88% 16%, rgba(255, 255, 255, 0.15), transparent 34%),
    linear-gradient(180deg, transparent 42%, rgba(244, 116, 74, 0.22));
}

.hero-watermark {
  right: -36px;
  bottom: -18px;
  color: rgba(255, 255, 255, 0.07);
}

.quick-facts {
  width: min(calc(100% - 48px), 1240px);
  margin: 28px auto 72px;
  background: transparent;
}

.fact-bar {
  gap: 12px;
  color: var(--ink);
  background: transparent;
}

.fact-bar > div {
  border-top: 5px solid var(--red);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(41, 23, 31, 0.08);
}

.fact-bar strong {
  color: var(--red);
}

.outcomes {
  margin-top: 14px;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(41, 23, 31, 0.06);
}

.guide-overview,
.why-dubai-section,
.recognition-section,
.degree-sequence,
.career-section,
.life-section,
.fee-story-section,
.path-section,
.community-section,
.faq-section,
.final-action {
  width: min(calc(100% - 48px), 1240px);
  margin-right: auto;
  margin-left: auto;
}

.guide-overview,
.why-dubai-section,
.recognition-section,
.degree-sequence,
.career-section,
.life-section,
.fee-story-section,
.path-section,
.community-section,
.faq-section {
  overflow: hidden;
  border-radius: 24px;
  box-shadow: var(--shadow);
}

.guide-overview,
.recognition-section,
.degree-sequence,
.career-section,
.life-section,
.fee-story-section,
.path-section,
.community-section,
.faq-section {
  background: #fff;
}

.guide-overview {
  margin-bottom: 72px;
}

.guide-overview nav a {
  transition: color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.guide-overview nav a:hover,
.guide-overview nav a:focus-visible {
  transform: translateY(-2px);
}

.why-dubai-section {
  margin-bottom: 72px;
  padding: clamp(34px, 5vw, 64px);
}

.why-dubai-grid .dubai-connected {
  background-image: url("assets/campus-students-together.webp");
}

.why-dubai-grid article {
  border: 4px solid #fff;
  box-shadow: 0 18px 38px rgba(42, 20, 32, 0.18);
}

.recognition-section {
  margin-bottom: 72px;
}

.degree-sequence {
  margin-top: 0;
  margin-bottom: 72px;
}

.degree-sequence > .book-section,
.degree-sequence > .book-section.reverse {
  width: 100%;
  margin: 0;
}

.section-content,
.curriculum-card,
.curriculum-card header,
.unit-list li,
.option-line,
.link-list a,
.link-list a > span:last-child {
  min-width: 0;
}

.curriculum-card {
  overflow: hidden;
  padding: 22px;
  border: 1px solid var(--line);
  border-top: 5px solid var(--red);
  border-radius: 16px;
  background: #fff;
}

.curriculum-card.teal-card {
  border-color: var(--line);
  border-top-color: var(--teal);
}

.curriculum-card header {
  align-items: flex-start;
}

.curriculum-card h3,
.curriculum-card header span,
.option-line,
.unit-list li,
.link-list strong,
.link-list small {
  overflow-wrap: anywhere;
}

.curriculum-card h3 {
  color: var(--ink);
}

.curriculum-card header span {
  flex: 0 0 auto;
}

.unit-list b {
  color: var(--red);
}

.career-section,
.life-section,
.fee-story-section,
.path-section,
.community-section,
.faq-section {
  margin-bottom: 72px;
}

.career-section {
  border-top: 7px solid var(--red);
}

.career-proof-grid article,
.facility-grid article,
.student-proof article {
  border-radius: 16px;
}

.price-grid article {
  padding: 24px;
  border: 1px solid var(--line);
  border-top: 5px solid var(--teal);
  border-radius: 16px;
  background: #fff;
}

.link-list a {
  padding-right: 8px;
  padding-left: 8px;
}

.link-list a:hover,
.link-list a:focus-visible {
  border-radius: 12px;
  background: #fff5f5;
}

.path-section {
  border-top: 7px solid var(--pink);
}

.path-steps li {
  background: #fff;
  box-shadow: 0 10px 25px rgba(42, 20, 32, 0.07);
}

.community-section {
  padding: clamp(34px, 5vw, 66px);
}

.final-action {
  margin-bottom: 72px;
}

.site-footer {
  background: var(--gradient);
}

.site-footer::before {
  background:
    radial-gradient(circle at 18% 18%, rgba(255, 255, 255, 0.14), transparent 32%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(244, 116, 74, 0.2));
}

.sticky-application a {
  background: var(--red);
}

@media (max-width: 980px) {
  .hero {
    width: min(calc(100% - 32px), 920px);
    margin-top: 20px;
  }

  .quick-facts,
  .guide-overview,
  .why-dubai-section,
  .recognition-section,
  .degree-sequence,
  .career-section,
  .life-section,
  .fee-story-section,
  .path-section,
  .community-section,
  .faq-section,
  .final-action {
    width: min(calc(100% - 32px), 920px);
  }
}

@media (max-width: 700px) {
  body {
    padding-bottom: calc(82px + env(safe-area-inset-bottom));
  }

  .header-inner {
    min-height: 86px;
  }

  .header-brand img {
    width: 128px;
  }

  .hero,
  .quick-facts,
  .guide-overview,
  .why-dubai-section,
  .recognition-section,
  .degree-sequence,
  .career-section,
  .life-section,
  .fee-story-section,
  .path-section,
  .community-section,
  .faq-section,
  .final-action {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    border-radius: 0;
  }

  .hero {
    margin-top: 0;
  }

  .hero-video-frame {
    border-width: 3px;
  }

  .quick-facts {
    margin-bottom: 28px;
  }

  .fact-bar {
    gap: 1px;
  }

  .fact-bar > div {
    border-top-width: 4px;
    border-radius: 0;
    box-shadow: none;
  }

  .outcomes {
    margin-top: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .guide-overview,
  .why-dubai-section,
  .recognition-section,
  .degree-sequence,
  .career-section,
  .life-section,
  .fee-story-section,
  .path-section,
  .community-section,
  .faq-section,
  .final-action {
    margin-bottom: 0;
    box-shadow: none;
  }

  .curriculum-card {
    padding: 20px 18px;
  }

  .curriculum-card header {
    gap: 10px;
  }

  .community-section {
    padding: 36px 20px;
  }

  .sticky-application {
    display: none;
  }
}

@media (max-width: 390px) {
  .header-brand img {
    width: 116px;
  }

  .curriculum-card h3 {
    font-size: 24px;
  }
}