.cc-platform-page { overflow: hidden; }

.cc-platform-hero { background: var(--cc-white); min-height: 780px; overflow: hidden; position: relative; }
.cc-platform-hero__grid { align-items: stretch; display: grid; gap: clamp(28px,3vw,48px); grid-template-columns: minmax(0,1fr) minmax(45%,1fr); margin-left: max(var(--cc-pad),(100vw - var(--cc-max))/2); margin-right: 0; min-height: 780px; padding-block: 0; width: calc(100% - max(var(--cc-pad),(100vw - var(--cc-max))/2)); }
.cc-platform-hero__copy { align-self: center; padding-block: clamp(90px,11vw,150px); position: relative; z-index: 2; }
.cc-platform-hero__visual { align-items: flex-end; background: var(--cc-ice); display: flex; justify-content: center; min-height: 780px; overflow: hidden; position: relative; }
.cc-platform-hero__visual::before { background: linear-gradient(90deg, rgba(255,255,255,.36), rgba(255,255,255,0) 24%); content: ""; inset: 0; position: absolute; z-index: 1; }
.cc-platform-hero__visual img { height: 100%; object-fit: cover; width: 100%; }
.cc-platform-hero__signal { background: linear-gradient(180deg,rgba(7,26,54,0),rgba(7,26,54,.82)); bottom: 0; box-shadow: none; left: 0; padding: 80px 42px 38px; position: absolute; right: 0; z-index: 2; }
.cc-platform-hero__signal strong { color: var(--cc-white); display: block; font-size: 18px; }
.cc-signal-line { align-items: center; display: grid; gap: 9px; grid-template-columns: repeat(7, 1fr); margin-top: 18px; }
.cc-signal-line i { background: var(--cc-blue); border-radius: 50%; height: 8px; position: relative; width: 8px; }
.cc-signal-line i:not(:last-child)::after { background: var(--cc-line); content: ""; height: 1px; left: 12px; position: absolute; top: 4px; width: calc(100% + 2px); }

.cc-principle { background: var(--cc-mist); padding: var(--cc-section) 0; }
.cc-principle__intro { display: grid; gap: 70px; grid-template-columns: .92fr 1.08fr; }
.cc-principle__text { color: var(--cc-muted); font-size: 18px; line-height: 1.7; }
.cc-principle__text p { margin: 0 0 24px; }
.cc-core-map { margin-top: var(--cc-gap-visual); min-height: 610px; position: relative; }
.cc-core-map::before,.cc-core-map::after { border: 1px solid var(--cc-line); border-radius: 50%; content: ""; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); }
.cc-core-map::before { height: 430px; width: 430px; }
.cc-core-map::after { height: 570px; width: 570px; }
.cc-core-map__center { align-items: center; background: var(--cc-blue); border-radius: 50%; box-shadow: 0 25px 70px rgba(23,105,255,.25); color: var(--cc-white); display: flex; font-size: 21px; font-weight: 750; height: 190px; justify-content: center; left: 50%; letter-spacing: -.02em; position: absolute; text-align: center; top: 50%; transform: translate(-50%,-50%); width: 190px; z-index: 2; }
.cc-core-map__item { color: var(--cc-navy); font-size: clamp(17px,1.7vw,22px); font-weight: 680; position: absolute; transform: translate(-50%,-50%); white-space: nowrap; }
.cc-core-map__item::before { background: var(--cc-blue); border-radius: 50%; content: ""; display: inline-block; height: 7px; margin-right: 10px; vertical-align: 3px; width: 7px; }
.cc-core-map__item:nth-child(2){left:18%;top:17%}.cc-core-map__item:nth-child(3){left:50%;top:8%}.cc-core-map__item:nth-child(4){left:82%;top:17%}.cc-core-map__item:nth-child(5){left:91%;top:50%}.cc-core-map__item:nth-child(6){left:81%;top:83%}.cc-core-map__item:nth-child(7){left:50%;top:92%}.cc-core-map__item:nth-child(8){left:19%;top:83%}.cc-core-map__item:nth-child(9){left:9%;top:50%}

.cc-journey-section { background: var(--cc-navy); color: var(--cc-white); padding: var(--cc-section) 0; }
.cc-journey-section .cc-eyebrow { color: #79baff; }
.cc-journey-section .cc-h2 { color: var(--cc-white); }
.cc-journey { display: grid; gap: 0; grid-template-columns: repeat(4,1fr); margin-top: var(--cc-gap-visual); }
.cc-journey__step { border-left: 1px solid rgba(255,255,255,.18); min-height: 210px; padding: 28px 28px 28px 24px; position: relative; }
.cc-journey__step:nth-child(n+5) { border-top: 1px solid rgba(255,255,255,.18); }
.cc-journey__step b { color: #69b0ff; display: block; font-size: 11px; letter-spacing: .15em; margin-bottom: 42px; }
.cc-journey__step strong { color: var(--cc-white); display: block; font-size: clamp(20px,2vw,27px); line-height: 1.18; }
.cc-journey__step:first-child { background: var(--cc-blue); border-left: 0; }
.cc-journey__step:first-child b { color: rgba(255,255,255,.72); }
.cc-journey__step:not(:last-child)::after { color: #69b0ff; content: "→"; font-size: 20px; position: absolute; right: 18px; top: 27px; }

.cc-ecosystem { background: var(--cc-white); padding: var(--cc-section) 0; }
.cc-ecosystem__head { display: grid; gap: 60px; grid-template-columns: 1fr 1fr; }
.cc-ecosystem__body { display: grid; gap: 0; grid-template-columns: repeat(3,1fr); margin-top: var(--cc-gap-visual); position: relative; }
.cc-ecosystem__core { align-items: center; background: var(--cc-blue); color: var(--cc-white); display: flex; flex-direction: column; grid-column: 2; grid-row: 1 / span 2; justify-content: center; min-height: 520px; padding: 45px; text-align: center; }
.cc-ecosystem__core strong { font-size: 36px; letter-spacing: -.04em; }
.cc-ecosystem__core span { color: rgba(255,255,255,.75); line-height: 1.6; margin-top: 18px; }
.cc-ecosystem__item { border-bottom: 1px solid var(--cc-line); min-height: 260px; padding: 34px; }
.cc-ecosystem__item:nth-child(2),.cc-ecosystem__item:nth-child(5),.cc-ecosystem__item:nth-child(6) { border-right: 1px solid var(--cc-line); }
.cc-ecosystem__item small { color: var(--cc-blue); font-weight: 750; letter-spacing: .12em; }
.cc-ecosystem__item h3 { color: var(--cc-navy); font-size: 28px; letter-spacing: -.035em; margin: 28px 0 13px; }
.cc-ecosystem__item p { color: var(--cc-muted); line-height: 1.6; margin: 0; }

.cc-platform-photo { min-height: 800px; }
.cc-platform-photo > img { object-position: center; }

.cc-change-section { background: var(--cc-ice); padding: var(--cc-section) 0; }
.cc-change { display: grid; gap: clamp(45px,7vw,100px); grid-template-columns: .82fr 1.18fr; margin-top: var(--cc-gap-visual); }
.cc-change__event { background: var(--cc-white); border-top: 4px solid var(--cc-blue); padding: clamp(35px,5vw,64px); }
.cc-change__time { color: var(--cc-blue); font-size: 13px; font-weight: 750; letter-spacing: .14em; }
.cc-change__event h3 { color: var(--cc-navy); font-size: clamp(28px,3vw,44px); margin: 35px 0 45px; }
.cc-room-change { align-items: center; display: flex; gap: 22px; }
.cc-room-change strong { color: var(--cc-navy); flex: 0 0 auto; font-size: clamp(30px,4vw,55px); letter-spacing: -.04em; line-height: 1; white-space: nowrap; }
.cc-room-change span { color: var(--cc-blue); font-size: 30px; }
.cc-change__results { border-top: 1px solid var(--cc-line); }
.cc-change__row { align-items: center; border-bottom: 1px solid var(--cc-line); display: grid; gap: 25px; grid-template-columns: 1fr auto; padding: 26px 0; }
.cc-change__row strong { color: var(--cc-navy); font-size: 20px; }
.cc-change__row span { color: var(--cc-blue); font-size: 13px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.cc-concept-note { color: var(--cc-muted); font-size: 13px; line-height: 1.55; margin-top: 26px; }

.cc-connect { background: var(--cc-white); padding: var(--cc-section) 0; }
.cc-architecture { display: grid; gap: 28px; grid-template-columns: repeat(3,1fr); margin-top: var(--cc-gap-visual); text-align: center; }
.cc-architecture__core { align-items: center; background: var(--cc-navy); color: var(--cc-white); display: flex; font-size: 25px; font-weight: 750; grid-column: 1 / -1; justify-content: center; min-height: 130px; }
.cc-architecture__source { border: 1px solid var(--cc-line); color: var(--cc-navy); font-size: 20px; font-weight: 680; padding: 36px 20px; position: relative; }
.cc-architecture__source::before { color: var(--cc-blue); content: "↓"; left: 50%; position: absolute; top: -25px; }
.cc-architecture__output { background: var(--cc-ice); color: var(--cc-navy); font-size: 22px; font-weight: 680; grid-column: 1 / -1; padding: 36px; }

.cc-growth { background: var(--cc-mist); padding: var(--cc-section) 0; }
.cc-growth__rail { display: grid; gap: 24px; grid-template-columns: .95fr 1.4fr; margin-top: var(--cc-gap-visual); }
.cc-growth__stage { background: var(--cc-white); border-top: 3px solid var(--cc-blue); padding: 40px; }
.cc-growth__stage small { color: var(--cc-blue); font-weight: 750; letter-spacing: .14em; }
.cc-growth__stage h3 { color: var(--cc-navy); font-size: 32px; margin: 26px 0 8px; }
.cc-growth__plus { display: grid; gap: 12px; grid-template-columns: repeat(2,1fr); margin-top: 28px; }
.cc-growth__plus span { border-top: 1px solid var(--cc-line); color: var(--cc-navy); font-weight: 650; padding: 18px 0; }

.cc-perspectives { background: var(--cc-white); padding: var(--cc-section) 0; }
.cc-perspectives__grid { display: grid; gap: 16px; grid-template-columns: 1.25fr .75fr .75fr; grid-template-rows: repeat(2,330px); margin-top: var(--cc-gap-visual); }
.cc-perspective { min-height: 0; overflow: hidden; position: relative; }
.cc-perspective:first-child { grid-row: 1 / span 2; }
.cc-perspective:last-child { grid-column: 2 / span 2; }
.cc-perspective img { height: 100%; object-fit: cover; transition: transform .5s ease; width: 100%; }
.cc-perspective:hover img { transform: scale(1.025); }
.cc-perspective::after { background: linear-gradient(180deg,transparent 35%,rgba(4,18,41,.9)); content: ""; inset: 0; position: absolute; }
.cc-perspective__copy { bottom: 0; color: var(--cc-white); left: 0; padding: 28px; position: absolute; right: 0; z-index: 1; }
.cc-perspective__copy small { color: #8fc6ff; font-weight: 750; letter-spacing: .13em; }
.cc-perspective__copy h3 { color: var(--cc-white); font-size: 28px; margin: 10px 0 0; }

@media (max-width: 1100px) {
  .cc-platform-hero__grid { gap: 36px; grid-template-columns: minmax(0,1fr) minmax(46%,1fr); }
  .cc-core-map { transform: scale(.9); }
  .cc-ecosystem__body { grid-template-columns: 1fr 1fr; }
  .cc-ecosystem__core { grid-column: 1 / -1; grid-row: auto; min-height: 280px; }
  .cc-perspectives__grid { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3,360px); }
  .cc-perspective:first-child { grid-column: 1 / -1; grid-row: auto; }
  .cc-perspective:last-child { grid-column: 1 / -1; }
}

@media (max-width: 800px) {
  .cc-platform-hero__grid,.cc-principle__intro,.cc-ecosystem__head,.cc-change,.cc-growth__rail { grid-template-columns: 1fr; }
  .cc-platform-hero__grid { margin-inline: auto; min-height: 0; width: min(calc(100% - 2 * var(--cc-pad)),var(--cc-max)); }
  .cc-platform-hero__copy { padding-block: 85px 50px; }
  .cc-platform-hero__visual { margin-inline: calc(0px - var(--cc-pad)); min-height: clamp(460px,72vw,620px); width: 100vw; }
  .cc-platform-hero__signal { padding: 70px 28px 30px; }
  .cc-core-map { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; min-height: 0; transform: none; }
  .cc-core-map::before,.cc-core-map::after { display: none; }
  .cc-core-map__center { border-radius: 0; grid-column: 1 / -1; height: auto; left: auto; min-height: 150px; position: relative; top: auto; transform: none; width: auto; }
  .cc-core-map__item { border-bottom: 1px solid var(--cc-line); left: auto!important; padding: 20px 0; position: relative; top: auto!important; transform: none; white-space: normal; }
  .cc-journey { grid-template-columns: 1fr; }
  .cc-journey__step { border-left: 1px solid rgba(255,255,255,.18); border-top: 0!important; min-height: 0; padding: 25px 25px 25px 70px; }
  .cc-journey__step b { left: 22px; margin: 0; position: absolute; top: 30px; }
  .cc-journey__step:not(:last-child)::after { bottom: -10px; content: "↓"; left: 28px; right: auto; top: auto; z-index: 2; }
  .cc-ecosystem__body,.cc-architecture { grid-template-columns: 1fr; }
  .cc-ecosystem__core,.cc-architecture__core,.cc-architecture__output { grid-column: auto; }
  .cc-ecosystem__item { border-right: 0!important; min-height: 0; }
  .cc-architecture__source::before { content: "↓"; }
  .cc-perspectives__grid { grid-template-columns: 1fr; grid-template-rows: repeat(4,460px); }
  .cc-perspective:first-child,.cc-perspective:last-child { grid-column: auto; }
}

@media (max-width: 520px) {
  .cc-platform-hero__visual { min-height: 410px; }
  .cc-platform-hero__signal { padding: 64px 24px 26px; }
  .cc-core-map { grid-template-columns: 1fr; }
  .cc-room-change { align-items: flex-start; flex-direction: column; }
  .cc-growth__plus { grid-template-columns: 1fr; }
  .cc-perspectives__grid { grid-template-rows: repeat(4,400px); }
}
