:root {
  --sccm-id-ink: #15302d;
  --sccm-id-deep: #062f2a;
  --sccm-id-green: #0d4a42;
  --sccm-id-gold: #d9b866;
  --sccm-id-gold-soft: #f1e2b6;
  --sccm-id-paper: #f7f6f1;
  --sccm-id-line: #d8d5ca;
  --sccm-id-white: #ffffff;
}

#top .sccm-id-growth-page,
#top .sccm-id-market-entry,
#top .sccm-id-resource-entry {
  box-sizing: border-box;
  color: var(--sccm-id-ink);
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
}

#top .sccm-id-growth-page *,
#top .sccm-id-market-entry *,
#top .sccm-id-resource-entry * {
  box-sizing: border-box;
}

#top .sccm-id-growth-page {
  margin-left: calc(50% - 50vw);
  overflow: clip;
  width: 100vw;
}

#top .sccm-id-shell {
  margin: 0 auto;
  max-width: 1240px;
  padding-left: 32px;
  padding-right: 32px;
  width: 100%;
}

#top .sccm-id-kicker {
  color: #a9842e;
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  margin-bottom: 14px;
  text-transform: uppercase;
}

#top .sccm-id-growth-page h1,
#top .sccm-id-growth-page h2,
#top .sccm-id-growth-page h3,
#top .sccm-id-market-entry h2,
#top .sccm-id-resource-entry h2 {
  color: var(--sccm-id-ink);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  letter-spacing: 0;
  margin-top: 0;
}

#top .sccm-id-growth-page h1 {
  color: var(--sccm-id-white) !important;
  font-size: 58px;
  line-height: 1.04;
  margin-bottom: 22px;
  max-width: 780px;
}

#top .sccm-id-growth-page h2,
#top .sccm-id-market-entry h2,
#top .sccm-id-resource-entry h2 {
  font-size: 40px;
  line-height: 1.12;
  margin-bottom: 18px;
}

#top .sccm-id-growth-page h3 {
  font-size: 25px;
  line-height: 1.2;
  margin-bottom: 10px;
}

#top .sccm-id-growth-page p,
#top .sccm-id-market-entry p,
#top .sccm-id-resource-entry p,
#top .sccm-id-growth-page li,
#top .sccm-id-growth-page td,
#top .sccm-id-growth-page th {
  font-size: 17px;
  line-height: 1.72;
}

#top .sccm-id-hero {
  align-items: center;
  display: flex;
  min-height: 660px;
  overflow: hidden;
  position: relative;
}

#top .sccm-id-hero__image,
#top .sccm-id-hero::after {
  height: 100%;
  inset: 0;
  position: absolute;
  width: 100%;
}

#top .sccm-id-hero__image {
  object-fit: cover;
  object-position: center;
}

#top .sccm-id-hero::after {
  background: rgba(2, 35, 31, 0.72);
  content: "";
}

#top .sccm-id-hero .sccm-id-shell {
  padding-bottom: 86px;
  padding-top: 86px;
  position: relative;
  z-index: 1;
}

#top .sccm-id-hero .sccm-id-kicker {
  color: var(--sccm-id-gold-soft);
}

#top .sccm-id-hero__lead {
  color: rgba(255,255,255,.92);
  font-size: 21px !important;
  max-width: 760px;
}

#top .sccm-id-proofline {
  border-top: 1px solid rgba(255,255,255,.28);
  display: flex;
  flex-wrap: wrap;
  gap: 12px 26px;
  margin-top: 34px;
  max-width: 900px;
  padding-top: 22px;
}

#top .sccm-id-proofline span {
  color: var(--sccm-id-white);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
}

#top .sccm-id-section {
  background: var(--sccm-id-white);
  padding: 86px 0;
}

#top .sccm-id-section--paper {
  background: var(--sccm-id-paper);
}

#top .sccm-id-section--deep {
  background: var(--sccm-id-deep);
  color: var(--sccm-id-white);
}

#top .sccm-id-section--deep h2,
#top .sccm-id-section--deep h3 {
  color: var(--sccm-id-white);
}

#top .sccm-id-intro-grid,
#top .sccm-id-two-col,
#top .sccm-id-medan-grid,
#top .sccm-id-final-grid {
  display: grid;
  gap: 54px;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
}

#top .sccm-id-answer-panel,
#top .sccm-id-checklist,
#top .sccm-id-source-panel {
  background: var(--sccm-id-deep);
  border-top: 4px solid var(--sccm-id-gold);
  color: var(--sccm-id-white);
  padding: 32px;
}

#top .sccm-id-answer-panel h2,
#top .sccm-id-answer-panel h3,
#top .sccm-id-checklist h3,
#top .sccm-id-source-panel h3 {
  color: var(--sccm-id-white) !important;
}

#top .sccm-id-answer-panel p,
#top .sccm-id-checklist li,
#top .sccm-id-source-panel p {
  color: rgba(255,255,255,.88) !important;
}

#top .sccm-id-answer-panel li,
#top .sccm-id-checklist p,
#top .sccm-id-checklist li {
  color: rgba(255,255,255,.88) !important;
}

#top .sccm-id-city-nav {
  background: var(--sccm-id-green);
  border-bottom: 1px solid rgba(255,255,255,.18);
  border-top: 1px solid rgba(255,255,255,.18);
}

#top .sccm-id-city-nav .sccm-id-shell {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-bottom: 18px;
  padding-top: 18px;
}

#top .sccm-id-city-nav a {
  color: var(--sccm-id-white);
  font-size: 13px;
  font-weight: 800;
  padding: 9px 18px;
  text-decoration: none;
  text-transform: uppercase;
}

#top .sccm-id-city-nav a:hover,
#top .sccm-id-city-nav a:focus {
  color: var(--sccm-id-gold-soft);
}

#top .sccm-id-step-grid,
#top .sccm-id-city-grid,
#top .sccm-id-topic-grid {
  display: grid;
  gap: 20px;
  margin-top: 36px;
}

#top .sccm-id-step-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#top .sccm-id-city-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#top .sccm-id-topic-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#top .sccm-id-step,
#top .sccm-id-city-card,
#top .sccm-id-topic {
  background: var(--sccm-id-white);
  border: 1px solid var(--sccm-id-line);
  border-radius: 4px;
  padding: 27px;
}

#top .sccm-id-section--paper .sccm-id-step,
#top .sccm-id-section--paper .sccm-id-city-card,
#top .sccm-id-section--paper .sccm-id-topic {
  background: rgba(255,255,255,.82);
}

#top .sccm-id-step__number {
  color: #9b7728;
  display: block;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 38px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 18px;
}

#top .sccm-id-city-card--medan {
  background: var(--sccm-id-deep) !important;
  border-color: var(--sccm-id-deep);
  color: var(--sccm-id-white);
  grid-column: span 2;
}

#top .sccm-id-city-card--medan h3,
#top .sccm-id-city-card--medan a {
  color: var(--sccm-id-white);
}

#top .sccm-id-city-card--medan p {
  color: rgba(255,255,255,.86);
}

#top .sccm-id-city-label {
  color: #9b7728;
  display: block;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 11px;
  text-transform: uppercase;
}

#top .sccm-id-city-card--medan .sccm-id-city-label {
  color: var(--sccm-id-gold-soft);
}

#top .sccm-id-table-wrap {
  border: 1px solid var(--sccm-id-line);
  margin-top: 34px;
  overflow-x: auto;
}

#top .sccm-id-table {
  border-collapse: collapse;
  margin: 0;
  min-width: 780px;
  width: 100%;
}

#top .sccm-id-table th,
#top .sccm-id-table td {
  border-bottom: 1px solid var(--sccm-id-line);
  padding: 18px 20px;
  text-align: left;
  vertical-align: top;
}

#top .sccm-id-table th {
  background: var(--sccm-id-deep);
  color: var(--sccm-id-white);
  font-size: 13px;
  text-transform: uppercase;
}

#top .sccm-id-table tr:last-child td {
  border-bottom: 0;
}

#top .sccm-id-list {
  margin: 18px 0 0;
  padding-left: 22px;
}

#top .sccm-id-list li {
  margin-bottom: 9px;
}

#top .sccm-id-faq {
  border-top: 1px solid var(--sccm-id-line);
}

#top .sccm-id-faq details {
  border-bottom: 1px solid var(--sccm-id-line);
  padding: 22px 0;
}

#top .sccm-id-faq summary {
  color: var(--sccm-id-ink);
  cursor: pointer;
  font-size: 18px;
  font-weight: 750;
  padding-right: 35px;
}

#top .sccm-id-faq details p {
  margin: 14px 0 0;
  max-width: 900px;
}

#top .sccm-id-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 16px 24px;
  margin-top: 30px;
}

#top .sccm-id-button {
  border: 1px solid transparent;
  border-radius: 4px;
  display: inline-flex;
  font-size: 14px;
  font-weight: 800;
  justify-content: center;
  min-height: 50px;
  padding: 14px 22px;
  text-align: center;
  text-decoration: none;
}

#top .sccm-id-button--gold {
  background: var(--sccm-id-gold);
  color: #17302d;
}

#top .sccm-id-button--dark {
  background: var(--sccm-id-deep);
  color: var(--sccm-id-white);
}

#top .sccm-id-button--outline {
  border-color: rgba(255,255,255,.55);
  color: var(--sccm-id-white);
}

#top .sccm-id-text-link,
#top .sccm-id-growth-page a:not(.sccm-id-button) {
  color: #806018;
  font-weight: 750;
}

#top .sccm-id-section--deep a:not(.sccm-id-button),
#top .sccm-id-city-card--medan a:not(.sccm-id-button) {
  color: var(--sccm-id-gold-soft);
}

#top .sccm-id-note {
  border-left: 4px solid var(--sccm-id-gold);
  margin-top: 30px;
  padding: 4px 0 4px 22px;
}

#top .sccm-id-disclaimer {
  color: #5b6765;
  font-size: 13px !important;
  margin-top: 28px;
}

#top .sccm-id-market-entry,
#top .sccm-id-resource-entry {
  margin-left: calc(50% - 50vw);
  width: 100vw;
}

#top .sccm-id-market-entry {
  background: var(--sccm-id-deep);
  color: var(--sccm-id-white);
  padding: 52px 0;
}

#top .sccm-id-market-entry h2,
#top .sccm-id-market-entry p {
  color: var(--sccm-id-white);
}

#top .sccm-id-market-entry p {
  color: rgba(255,255,255,.86);
  max-width: 780px;
}

#top .sccm-id-market-grid {
  align-items: center;
  display: grid;
  gap: 46px;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, .55fr);
}

#top .sccm-id-market-cities {
  border-left: 1px solid rgba(255,255,255,.3);
  display: grid;
  gap: 6px;
  padding-left: 38px;
}

#top .sccm-id-market-cities span {
  color: var(--sccm-id-white);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 25px;
  font-weight: 650;
}

#top .sccm-id-market-cities small {
  color: var(--sccm-id-gold-soft);
  font-size: 13px;
  margin-top: 6px;
}

#top .sccm-id-market-entry .sccm-id-text-link {
  color: var(--sccm-id-gold-soft);
}

#top .sccm-id-resource-entry {
  background: #e9e5d9;
  border-bottom: 1px solid #d2c9b5;
  border-top: 1px solid #d2c9b5;
  padding: 42px 0;
}

#top .sccm-id-resource-row {
  align-items: center;
  display: flex;
  gap: 40px;
  justify-content: space-between;
}

#top .sccm-id-resource-row p {
  margin-bottom: 0;
  max-width: 780px;
}

@media (max-width: 989px) {
  #top .sccm-id-growth-page h1 { font-size: 46px; }
  #top .sccm-id-growth-page h2,
  #top .sccm-id-market-entry h2,
  #top .sccm-id-resource-entry h2 { font-size: 34px; }
  #top .sccm-id-step-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #top .sccm-id-topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #top .sccm-id-intro-grid,
  #top .sccm-id-two-col,
  #top .sccm-id-medan-grid,
  #top .sccm-id-final-grid,
  #top .sccm-id-market-grid { grid-template-columns: 1fr; }
  #top .sccm-id-market-cities { border-left: 0; border-top: 1px solid rgba(255,255,255,.3); grid-template-columns: repeat(5, 1fr); padding-left: 0; padding-top: 25px; }
}

@media (max-width: 767px) {
  #top .sccm-id-shell { padding-left: 20px; padding-right: 20px; }
  #top .sccm-id-hero { min-height: 610px; }
  #top .sccm-id-hero__image { object-position: 62% center; }
  #top .sccm-id-hero::after { background: rgba(2,35,31,.78); }
  #top .sccm-id-hero .sccm-id-shell { padding-bottom: 60px; padding-top: 60px; }
  #top .sccm-id-growth-page h1 { font-size: 38px; line-height: 1.08; }
  #top .sccm-id-growth-page h2,
  #top .sccm-id-market-entry h2,
  #top .sccm-id-resource-entry h2 { font-size: 31px; }
  #top .sccm-id-growth-page p,
  #top .sccm-id-market-entry p,
  #top .sccm-id-resource-entry p,
  #top .sccm-id-growth-page li,
  #top .sccm-id-growth-page td,
  #top .sccm-id-growth-page th { font-size: 16px; }
  #top .sccm-id-hero__lead { font-size: 18px !important; }
  #top .sccm-id-section { padding: 60px 0; }
  #top .sccm-id-step-grid,
  #top .sccm-id-city-grid,
  #top .sccm-id-topic-grid { grid-template-columns: 1fr; }
  #top .sccm-id-city-card--medan { grid-column: auto; }
  #top .sccm-id-actions { align-items: stretch; flex-direction: column; }
  #top .sccm-id-button { width: 100%; }
  #top .sccm-id-city-nav .sccm-id-shell { justify-content: flex-start; overflow-x: auto; padding-left: 10px; padding-right: 10px; scrollbar-width: none; }
  #top .sccm-id-city-nav a { flex: 0 0 auto; }
  #top .sccm-id-market-entry { padding: 44px 0; }
  #top .sccm-id-market-cities { grid-template-columns: repeat(2, 1fr); }
  #top .sccm-id-resource-row { align-items: stretch; flex-direction: column; }
  #top .sccm-id-answer-panel,
  #top .sccm-id-checklist,
  #top .sccm-id-source-panel { padding: 25px; }
}
