/* Starry case story: spacious, image-led layouts following the hero. */
@media (max-width: 760px) {
  #case-modal.has-starry-case .case-modal-sheet { padding: 0; }
}
.case-modal-detail .starry-new .sr-section {
  width: min(88%, 1400px); max-width: 1400px; margin: 0 auto;
  padding: clamp(100px, 11vw, 180px) 0; border: 0;
}
.case-modal-detail .starry-new .sr-heading { display: block; margin: 0; }
.case-modal-detail .starry-new .case-index {
  display: inline-block; margin-bottom: 26px; color: #725cf4;
  font-size: 12px; font-weight: 700; letter-spacing: .12em;
}
.case-modal-detail .starry-new .sr-heading h2 {
  max-width: 850px; font-size: clamp(38px, 4.5vw, 72px); line-height: 1.2;
  letter-spacing: -.035em; text-wrap: pretty; color: #20213c;
}
.case-modal-detail .starry-new .sr-heading p {
  max-width: 620px; margin-top: 26px; color: #71758b;
  font-size: clamp(15px, 1.1vw, 18px); line-height: 2;
}
.case-modal-detail .starry-new .sr-cards { gap: 18px; }
.case-modal-detail .starry-new .sr-cards article {
  min-height: 0; padding: 30px; border: 0; border-radius: 24px;
  background: #f5f4fc;
}
.case-modal-detail .starry-new .sr-cards strong { line-height: 1.35; }
.case-modal-detail .starry-new .sr-cards span { font-size: 14px; line-height: 1.8; }
.case-modal-detail .starry-new .sr-visual { margin: 0; border-radius: 28px; overflow: hidden; }
.case-modal-detail .starry-new .sr-visual img { display: block; width: 100%; height: auto; object-fit: contain; }
.case-modal-detail .starry-new .sr-note { margin: 0; max-width: 700px; }
.case-modal-detail .starry-new .sr-note h3 { font-size: clamp(23px, 2vw, 32px); line-height: 1.4; }
.case-modal-detail .starry-new .sr-note p { font-size: 15px; line-height: 1.9; }

/* An opening statement, with the three motivations set as a quiet list. */
.case-modal-detail .starry-new #starry-background {
  display: grid; grid-template-columns: 1.2fr .7fr; gap: 10%; align-items: center;
}
.case-modal-detail .starry-new #starry-background .sr-cards { display: block; }
.case-modal-detail .starry-new #starry-background .sr-cards article {
  display: grid; grid-template-columns: 38px 1fr; column-gap: 20px;
  padding: 25px 0; border-radius: 0; background: transparent; border-bottom: 1px solid #e6e5f1;
}
.case-modal-detail .starry-new #starry-background .sr-cards article svg { grid-row: span 2; width: 26px; height: 26px; }
.case-modal-detail .starry-new #starry-background .sr-cards strong { margin: 0; }
.case-modal-detail .starry-new #starry-background .sr-cards span { margin-top: 6px; }

/* The product system is presented like a large canvas, then an information rail. */
.case-modal-detail .starry-new #starry-product { display: flex; flex-direction: column; align-items: stretch; gap: 64px; }
.case-modal-detail .starry-new #starry-product .sr-heading { text-align: center; }
.case-modal-detail .starry-new #starry-product .sr-heading h2,
.case-modal-detail .starry-new #starry-product .sr-heading p { margin-left: auto; margin-right: auto; }
.case-modal-detail .starry-new #starry-product .sr-system-visual { order: 3; }
.case-modal-detail .starry-new #starry-product .sr-goal-cards { order: 2; }
.case-modal-detail .starry-new #starry-product .sr-goal-cards article { background: transparent; padding: 8px 24px; border-radius: 0; border-left: 1px solid #e5e3f2; }
.case-modal-detail .starry-new #starry-product .sr-product-lines { order: 3; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.case-modal-detail .starry-new #starry-product .sr-product-lines p { display: block; padding: 24px 0; border-top: 1px solid #e8e7f2; border-bottom: 0; }
.case-modal-detail .starry-new #starry-product .sr-product-lines b,
.case-modal-detail .starry-new #starry-product .sr-product-lines span { display: block; }
.case-modal-detail .starry-new #starry-product .sr-product-lines span { margin-top: 8px; }

/* A lavender interlude gives the constraints their own scale. */
.case-modal-detail .starry-new #starry-challenge {
  width: 100%; max-width: none; padding: clamp(100px, 10vw, 170px) max(6%, calc((100% - 1400px)/2));
  background: linear-gradient(145deg,#f4f1ff,#e8e2ff); display: grid;
  grid-template-columns: .9fr 1fr; gap: 9%; align-items: center;
}
.case-modal-detail .starry-new #starry-challenge .sr-cards { grid-template-columns: repeat(2, 1fr); }
.case-modal-detail .starry-new #starry-challenge .sr-cards article { background: #ffffffb8; min-height: 200px; }

/* Alternate wide imagery and compact feature rows through the product story. */
.case-modal-detail .starry-new #starry-editor { display: grid; grid-template-columns: 1fr 1fr; gap: 55px 9%; align-items: start; }
.case-modal-detail .starry-new #starry-editor .sr-cards { grid-template-columns: repeat(2, 1fr); }
.case-modal-detail .starry-new #starry-editor .sr-cards article { padding: 22px 0; background: transparent; border-radius: 0; border-top: 1px solid #e5e3f0; }
.case-modal-detail .starry-new #starry-editor .sr-editing-keyword-wall { grid-column: 1 / -1; margin-top: 25px; }

/* Engineering section becomes a dark, high-contrast chapter. */
.case-modal-detail .starry-new #starry-build {
  width: 100%; max-width: none; padding: clamp(110px, 11vw, 180px) max(6%, calc((100% - 1400px)/2));
  background: #1c1941; color: #fff; display: grid; grid-template-columns: 1fr 1fr; gap: 60px 7%;
}
.case-modal-detail .starry-new #starry-build .sr-heading { grid-column: 1 / -1; }
.case-modal-detail .starry-new #starry-build .case-index { color: #b3a6ff; }
.case-modal-detail .starry-new #starry-build .sr-heading h2 { color: #fff; }
.case-modal-detail .starry-new #starry-build .sr-heading p,
.case-modal-detail .starry-new #starry-build .sr-note p { color: #c6c2da; }
.case-modal-detail .starry-new #starry-build .sr-cards { grid-column: 1 / -1; grid-template-columns: repeat(4, 1fr); }
.case-modal-detail .starry-new #starry-build .sr-cards article { background: #ffffff10; color: white; }
.case-modal-detail .starry-new #starry-build .sr-cards article svg { color: #b5a8ff; }
.case-modal-detail .starry-new #starry-build .sr-cards strong { color: #fff; font-size: clamp(23px, 2.4vw, 38px); }
.case-modal-detail .starry-new #starry-build .sr-cards span { color: #bebbd3; }
.case-modal-detail .starry-new #starry-build .sr-note { align-self: center; }
.case-modal-detail .starry-new #starry-build .sr-note h3 { color: white; }
.case-modal-detail .starry-new #starry-build .sr-visual { background: #f7f6fc; }

.case-modal-detail .starry-new #starry-collab { display: grid; grid-template-columns: .8fr 1.2fr; gap: 40px 8%; align-items: center; }
.case-modal-detail .starry-new #starry-collab .sr-heading { grid-column: 1; }
.case-modal-detail .starry-new #starry-collab .sr-cards { grid-column: 1; grid-template-columns: 1fr 1fr; }
.case-modal-detail .starry-new #starry-collab .sr-cards article { padding: 22px; background: #f4f2ff; }
.case-modal-detail .starry-new #starry-collab .sr-collab-visual { grid-column: 2; grid-row: 1 / 3; background: #ede9ff; box-shadow: 0 26px 70px #3b2b9b1a; }

.case-modal-detail .starry-new #starry-figma { display: grid; grid-template-columns: 1fr 1fr; gap: 60px 8%; align-items: start; }
.case-modal-detail .starry-new #starry-figma .sr-heading { grid-column: 1 / -1; max-width: 1000px; }
.case-modal-detail .starry-new #starry-figma .sr-cards { grid-template-columns: 1fr; }
.case-modal-detail .starry-new #starry-figma .sr-cards article { display: grid; grid-template-columns: 38px 1fr; column-gap: 18px; background: transparent; border-bottom: 1px solid #e5e4f0; border-radius: 0; padding: 22px 0; }
.case-modal-detail .starry-new #starry-figma .sr-cards svg { grid-row: span 2; }
.case-modal-detail .starry-new #starry-figma .sr-cards strong { margin: 0; }
.case-modal-detail .starry-new #starry-figma .sr-cards span { margin-top: 6px; }
.case-modal-detail .starry-new #starry-figma .sr-figma-ai-architecture { align-self: center; background: #f3f1ff; }
.case-modal-detail .starry-new #starry-figma .sr-tool-flow { margin: 0; align-self: center; }

.case-modal-detail .starry-new #starry-agent {
  width: 100%; max-width: none; padding: clamp(110px, 11vw, 180px) max(6%, calc((100% - 1400px)/2));
  background: linear-gradient(145deg,#efebff,#e5defe 60%,#f9f8ff); display: grid;
  grid-template-columns: 1fr 1fr; gap: 60px 8%; align-items: center;
}
.case-modal-detail .starry-new #starry-agent .sr-heading { grid-column: 1 / -1; }
.case-modal-detail .starry-new #starry-agent .sr-cards { grid-column: 1; grid-template-columns: 1fr 1fr; }
.case-modal-detail .starry-new #starry-agent .sr-cards article { background: #ffffff99; }
.case-modal-detail .starry-new #starry-agent .sr-agent-demo { grid-column: 2; grid-row: 2 / 4; margin: 0; border: 0; box-shadow: 0 28px 65px #38298429; }
.case-modal-detail .starry-new #starry-agent .sr-note { grid-column: 1; }

.case-modal-detail .starry-new #starry-growth { display: grid; grid-template-columns: 1fr 1fr; gap: 55px 8%; align-items: center; }
.case-modal-detail .starry-new #starry-growth .sr-heading { grid-column: 1; }
.case-modal-detail .starry-new #starry-growth .sr-cards { grid-column: 1; grid-template-columns: 1fr 1fr; }
.case-modal-detail .starry-new #starry-growth .sr-growth-visual { grid-column: 2; grid-row: 1 / 3; background: #f1efff; }

.case-modal-detail .starry-new #starry-results {
  width: 100%; max-width: none; padding: clamp(110px, 11vw, 180px) max(6%, calc((100% - 1400px)/2));
  background: linear-gradient(180deg,#f1eeff,#fff); display: flex; flex-direction: column; gap: 65px;
}
.case-modal-detail .starry-new #starry-results .sr-heading { max-width: 900px; }
.case-modal-detail .starry-new #starry-results .sr-cards { grid-template-columns: repeat(3,1fr); }
.case-modal-detail .starry-new #starry-results .sr-cards article { padding: 28px 0; border-radius: 0; border-top: 1px solid #bdb6e3; background: transparent; }
.case-modal-detail .starry-new #starry-results .sr-cards svg { display: none; }
.case-modal-detail .starry-new #starry-results .sr-cards strong { margin: 0; font-size: clamp(34px,4vw,64px); color: #5e4ce1; letter-spacing: -.04em; }
.case-modal-detail .starry-new #starry-results .sr-cards span { color: #696981; font-size: 15px; }
.case-modal-detail .starry-new #starry-results .sr-end { margin: 0; }
.case-modal-detail .starry-new .st-footer { width: min(88%, 1400px); max-width: 1400px; padding: 120px 0 160px; }

@media (max-width: 900px) {
 .case-modal-detail .starry-new #starry-background,
 .case-modal-detail .starry-new #starry-challenge,
 .case-modal-detail .starry-new #starry-editor,
 .case-modal-detail .starry-new #starry-collab,
 .case-modal-detail .starry-new #starry-figma,
 .case-modal-detail .starry-new #starry-agent,
 .case-modal-detail .starry-new #starry-growth { grid-template-columns: 1fr; gap: 48px; }
 .case-modal-detail .starry-new #starry-editor .sr-editing-keyword-wall,
 .case-modal-detail .starry-new #starry-figma .sr-heading,
 .case-modal-detail .starry-new #starry-agent .sr-heading { grid-column: 1; }
 .case-modal-detail .starry-new #starry-collab .sr-collab-visual,
 .case-modal-detail .starry-new #starry-agent .sr-agent-demo,
 .case-modal-detail .starry-new #starry-growth .sr-growth-visual { grid-column: 1; grid-row: auto; }
 .case-modal-detail .starry-new #starry-build .sr-cards,
 .case-modal-detail .starry-new #starry-product .sr-goal-cards { grid-template-columns: repeat(2, 1fr); }
 .case-modal-detail .starry-new #starry-product .sr-product-lines { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 600px) {
 .case-modal-detail .starry-new .sr-section { width: calc(100% - 40px); padding: 90px 0; }
 .case-modal-detail .starry-new #starry-challenge,
 .case-modal-detail .starry-new #starry-build,
 .case-modal-detail .starry-new #starry-agent,
 .case-modal-detail .starry-new #starry-results { width: 100%; padding: 90px 20px; }
 .case-modal-detail .starry-new .sr-heading h2 { font-size: clamp(34px, 9vw, 46px); }
 .case-modal-detail .starry-new #starry-build { grid-template-columns: 1fr; gap: 36px; }
 .case-modal-detail .starry-new #starry-build .sr-heading,
 .case-modal-detail .starry-new #starry-build .sr-cards { grid-column: 1; }
 .case-modal-detail .starry-new #starry-build .sr-cards,
 .case-modal-detail .starry-new #starry-product .sr-goal-cards,
 .case-modal-detail .starry-new #starry-challenge .sr-cards,
 .case-modal-detail .starry-new #starry-editor .sr-cards,
 .case-modal-detail .starry-new #starry-agent .sr-cards,
 .case-modal-detail .starry-new #starry-growth .sr-cards { grid-template-columns: 1fr 1fr; gap: 12px; }
 .case-modal-detail .starry-new .sr-cards article { padding: 20px; }
 .case-modal-detail .starry-new #starry-results .sr-cards { grid-template-columns: 1fr; gap: 8px; }
 .case-modal-detail .starry-new #starry-product { gap: 42px; }
 .case-modal-detail .starry-new #starry-product .sr-goal-cards article { padding: 10px 16px; }
 .case-modal-detail .starry-new #starry-challenge .sr-cards article { min-height: 0; }
 .case-modal-detail .starry-new #starry-figma .sr-tool-loop { grid-template-columns: 1fr; }
 .case-modal-detail .starry-new #starry-figma .sr-tool-arrow { transform: rotate(90deg); }
}
.case-modal-detail .starry-new .sr-editing-keyword-wall { height: clamp(460px, 55vw, 760px); background: #14132c; }
.case-modal-detail .starry-new .sr-editing-keyword-wall iframe { display: block; width: 100%; height: 100%; border: 0; }
@media (max-width: 600px) { .case-modal-detail .starry-new .sr-editing-keyword-wall { height: 440px; } }

/* Place the collaboration image and Agent demonstration below their explanations. */
.case-modal-detail .starry-new #starry-collab,
.case-modal-detail .starry-new #starry-agent { display:flex; flex-direction:column; align-items:stretch; gap:clamp(42px,5vw,70px); }
.case-modal-detail .starry-new #starry-collab .sr-heading,
.case-modal-detail .starry-new #starry-agent .sr-heading { order:1; max-width:1000px; }
.case-modal-detail .starry-new #starry-collab .sr-cards,
.case-modal-detail .starry-new #starry-agent .sr-cards { order:2; width:100%; }
.case-modal-detail .starry-new #starry-collab .sr-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
.case-modal-detail .starry-new #starry-agent .sr-cards { grid-template-columns:repeat(4,minmax(0,1fr)); }
.case-modal-detail .starry-new #starry-collab .sr-cards article,
.case-modal-detail .starry-new #starry-agent .sr-cards article { padding:clamp(24px,2.5vw,36px); }
.case-modal-detail .starry-new #starry-collab .sr-collab-visual { order:3; width:100%; }
.case-modal-detail .starry-new #starry-agent .sr-note { order:3; max-width:760px; }
.case-modal-detail .starry-new #starry-agent .sr-agent-demo { order:4; width:100%; aspect-ratio:7/5; margin:0; }
@media(max-width:900px) {
 .case-modal-detail .starry-new #starry-agent .sr-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
 .case-modal-detail .starry-new #starry-collab,
 .case-modal-detail .starry-new #starry-agent { gap:38px; }
 .case-modal-detail .starry-new #starry-collab .sr-cards article,
 .case-modal-detail .starry-new #starry-agent .sr-cards article { padding:20px; }
}

/* Give the data-model diagram a full-width stage for legibility. */
.case-modal-detail .starry-new #starry-figma { display:flex; flex-direction:column; align-items:stretch; gap:clamp(42px,5vw,70px); }
.case-modal-detail .starry-new #starry-figma .sr-heading { max-width:1000px; }
.case-modal-detail .starry-new #starry-figma .sr-cards { width:100%; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.case-modal-detail .starry-new #starry-figma .sr-cards article { border-bottom:0; border-top:1px solid #e5e4f0; padding:24px 0; }
.case-modal-detail .starry-new #starry-figma .sr-figma-ai-architecture { width:100%; align-self:stretch; position:relative; background:#eeeafe; }
.case-modal-detail .starry-new #starry-figma .sr-figma-ai-architecture a { display:block; color:white; text-decoration:none; }
.case-modal-detail .starry-new #starry-figma .sr-visual-open { position:absolute; right:22px; bottom:18px; padding:8px 12px; border-radius:99px; background:#35354bd9; color:#f3f3fa; font-size:12px; line-height:1.4; }
.case-modal-detail .starry-new #starry-figma .sr-figma-ai-architecture a:focus-visible { outline:3px solid #aa9aff; outline-offset:-4px; }
.case-modal-detail .starry-new #starry-figma .sr-tool-flow { width:100%; align-self:stretch; }
@media(max-width:700px){.case-modal-detail .starry-new #starry-figma .sr-cards { grid-template-columns:1fr; gap:0; }.case-modal-detail .starry-new #starry-figma .sr-visual-open { position:static; display:block; border-radius:0; text-align:right; background:#292937; }}

/* Results: headline above, a vertical metric column alongside the visual. */
.case-modal-detail .starry-new #starry-results {
  display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);
  gap:clamp(48px,5vw,76px) clamp(42px,6vw,90px); align-items:center;
}
.case-modal-detail .starry-new #starry-results .sr-heading { grid-column:1 / -1; }
.case-modal-detail .starry-new #starry-results .sr-cards { grid-column:1; grid-row:2; grid-template-columns:1fr; gap:0; align-self:stretch; }
.case-modal-detail .starry-new #starry-results .sr-cards article { padding:clamp(20px,2.3vw,32px) 0; }
.case-modal-detail .starry-new #starry-results .sr-project-results-visual { grid-column:2; grid-row:2; width:100%; align-self:center; }
.case-modal-detail .starry-new #starry-results .sr-end { grid-column:1 / -1; }
@media(max-width:800px) {
 .case-modal-detail .starry-new #starry-results { grid-template-columns:1fr; gap:40px; }
 .case-modal-detail .starry-new #starry-results .sr-heading,
 .case-modal-detail .starry-new #starry-results .sr-cards,
 .case-modal-detail .starry-new #starry-results .sr-project-results-visual,
 .case-modal-detail .starry-new #starry-results .sr-end { grid-column:1; grid-row:auto; }
}

/* A quieter, more balanced results composition. */
.case-modal-detail .starry-new #starry-results { grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:clamp(50px,7vw,100px); }
.case-modal-detail .starry-new #starry-results .sr-heading { max-width:1050px; }
.case-modal-detail .starry-new #starry-results .sr-heading h2 { max-width:1000px; }
.case-modal-detail .starry-new #starry-results .sr-results-platforms { white-space:nowrap; }
.case-modal-detail .starry-new #starry-results .sr-cards { align-self:start; gap:14px; }
.case-modal-detail .starry-new #starry-results .sr-cards article {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:16px;
  min-height:126px; padding:24px clamp(22px,2.5vw,36px); border:0; border-radius:22px;
  background:rgba(255,255,255,.72); box-shadow:0 12px 36px rgba(78,61,155,.045);
}
.case-modal-detail .starry-new #starry-results .sr-cards strong { font-size:clamp(30px,3vw,48px); line-height:1.15; letter-spacing:-.045em; }
.case-modal-detail .starry-new #starry-results .sr-cards span { margin:0; color:#65647c; font-size:15px; line-height:1.65; }
.case-modal-detail .starry-new #starry-results .sr-project-results-visual { max-width:560px; justify-self:end; box-shadow:0 28px 70px rgba(71,54,155,.13); }
@media(max-width:800px){
 .case-modal-detail .starry-new #starry-results { grid-template-columns:1fr; }
 .case-modal-detail .starry-new #starry-results .sr-project-results-visual { max-width:560px; justify-self:center; }
}
@media(max-width:480px){
 .case-modal-detail .starry-new #starry-results .sr-cards article { min-height:100px; padding:20px; gap:12px; }
 .case-modal-detail .starry-new #starry-results .sr-cards strong { font-size:27px; }
 .case-modal-detail .starry-new #starry-results .sr-cards span { font-size:13px; }
}

/* Let the metrics fill the height of the adjacent results artwork. */
@media(min-width:801px){
 .case-modal-detail .starry-new #starry-results .sr-cards { align-self:stretch; grid-template-rows:repeat(3,minmax(0,1fr)); }
 .case-modal-detail .starry-new #starry-results .sr-cards article {
   display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
   position:relative; min-height:0; padding:clamp(28px,3.1vw,46px);
 }
 .case-modal-detail .starry-new #starry-results .sr-cards strong { font-size:clamp(38px,4vw,60px); }
 .case-modal-detail .starry-new #starry-results .sr-cards span { margin-top:16px; font-size:16px; }
 .case-modal-detail .starry-new #starry-results .sr-cards svg {
   display:block; position:absolute; top:clamp(24px,2.6vw,38px); right:clamp(24px,2.6vw,38px);
   width:26px; height:26px; color:#8e7df0; opacity:.55;
 }
}
@media(min-width:801px){
 .case-modal-detail .starry-new #starry-results { grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); }
}
@media(min-width:801px){
 .case-modal-detail .starry-new #starry-results .sr-cards article { padding:clamp(24px,2.1vw,32px); }
}

/* Keep the product link anchored at the far right of the fixed case navigation. */
.case-modal-detail .starry-new .st-nav {
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
}
.case-modal-detail .starry-new .st-nav-website {
  grid-column:3; justify-self:end; display:inline-flex; align-items:center; gap:12px;
  padding:12px 20px; border-radius:999px; background:#fff; color:#111;
  font-size:13px; font-weight:600; letter-spacing:.01em; line-height:1.2;
  text-decoration:none; white-space:nowrap; transition:background .2s ease, transform .2s ease;
}
.case-modal-detail .starry-new .st-nav-website:hover { background:#f2f4ff; color:#111; transform:translateY(-1px); }
.case-modal-detail .starry-new .st-nav-website-logo { width:19px; height:19px; flex:none; border-radius:5px; }
.case-modal-detail .starry-new .st-nav-website span { font-size:inherit; line-height:inherit; }
.case-modal-detail .starry-new .st-nav-website:focus-visible { outline:2px solid #8fa0ff; outline-offset:3px; }
@media(max-width:800px) {
  .case-modal-detail .starry-new .st-nav {
    display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px; align-items:center;
  }
  .case-modal-detail .starry-new .st-nav-links { grid-column:2; min-width:0; justify-content:flex-start; }
  .case-modal-detail .starry-new .st-nav-website { grid-column:3; padding:10px 13px; gap:7px; font-size:11px; }
}
@media(max-width:480px) {
  .case-modal-detail .starry-new .st-nav { gap:8px; }
  .case-modal-detail .starry-new .st-nav-back { font-size:10px; }
  .case-modal-detail .starry-new .st-nav-links { gap:14px; }
  .case-modal-detail .starry-new .st-nav-links a { font-size:10px; }
  .case-modal-detail .starry-new .st-nav-website { padding:9px 10px; gap:5px; font-size:10px; }
}

/* Product ecosystem: one original visual followed by a restrained editorial index. */
.case-modal-detail .starry-new #starry-product .sr-system-visual {
  width:100%; margin:0; padding:0; overflow:visible; border-radius:0; background:transparent;
}
.case-modal-detail .starry-new #starry-product .sr-system-stage {
  position:relative; width:100%; overflow:hidden; border-radius:26px; background:#f1edff;
}
.case-modal-detail .starry-new #starry-product .sr-system-stage img {
  display:block; width:100%; height:auto; aspect-ratio:1774/887; object-fit:cover;
}
.case-modal-detail .starry-new #starry-product .sr-system-catalog {
  display:grid; grid-template-columns:1.35fr .72fr .82fr 1.35fr 1.05fr;
  margin-top:30px; padding-top:24px; border-top:1px solid #dedbee;
}
.case-modal-detail .starry-new #starry-product .sr-system-item {
  display:flex; flex-direction:column; align-items:flex-start; gap:7px; min-width:0;
  padding:0 20px; border-left:1px solid #e6e3f0;
}
.case-modal-detail .starry-new #starry-product .sr-system-item:first-child { padding-left:0; border-left:0; }
.case-modal-detail .starry-new #starry-product .sr-system-item > span {
  margin:0; color:#7868da; font:700 9px/1.2 Inter,Arial,sans-serif; letter-spacing:.13em;
}
.case-modal-detail .starry-new #starry-product .sr-system-item strong {
  margin:0; color:#292741; font-size:clamp(13px,1.02vw,16px); font-weight:650; line-height:1.5;
}
.case-modal-detail .starry-new #starry-product .sr-system-item small {
  color:#77758b; font-size:12px; line-height:1.6;
}
@media(max-width:900px) {
  .case-modal-detail .starry-new #starry-product .sr-system-catalog { grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:24px; }
  .case-modal-detail .starry-new #starry-product .sr-system-item:nth-child(4) { padding-left:0; border-left:0; }
}
@media(max-width:560px) {
  .case-modal-detail .starry-new #starry-product .sr-system-stage { border-radius:18px; }
  .case-modal-detail .starry-new #starry-product .sr-system-catalog { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 0; margin-top:22px; padding-top:20px; }
  .case-modal-detail .starry-new #starry-product .sr-system-item { padding:0 14px; }
  .case-modal-detail .starry-new #starry-product .sr-system-item:nth-child(odd) { padding-left:0; border-left:0; }
  .case-modal-detail .starry-new #starry-product .sr-system-item:nth-child(4) { padding-left:0; }
}