/* Client proof polish — scoped to the homepage ribbon and portfolio page. */
.client-ribbon {
  background: linear-gradient(90deg,#07111d,#0b1b2c 52%,#07111d);
  border-top: 1px solid rgba(143,220,255,.2);
  border-bottom: 1px solid rgba(143,220,255,.22);
  color: #f4f7fb;
}
.client-ribbon-inner {
  display: grid;
  grid-template-columns: minmax(180px,.8fr) minmax(420px,2fr) auto;
  gap: 28px;
  align-items: center;
  padding-block: 26px;
}
.client-ribbon-heading { display: grid; gap: 6px; }
.client-ribbon-heading span,.project-client-label {
  color: #8fdcff;
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .17em;
}
.client-ribbon-heading strong { font-family: 'Space Grotesk',sans-serif; font-size: 1rem; }
.client-ribbon-names { display: flex; flex-wrap: wrap; gap: 9px; }
.client-ribbon-names a {
  color: #e8f2fb;
  border: 1px solid #29435b;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: .78rem;
  text-decoration: none;
  background: rgba(17,39,59,.64);
}
.client-ribbon-names a:hover,.client-ribbon-names a:focus-visible { border-color:#15d9ff; color:#fff; }
.client-ribbon-cta { color:#8fdcff; font-size:.82rem; font-weight:700; white-space:nowrap; text-underline-offset:5px; }

.client-proof-intro { padding-bottom: 54px; }
.client-proof-intro .section-label { margin-bottom: 16px; }
.client-proof-intro h1 span { color:#8fdcff; }
.client-proof-intro > p { max-width: 780px; font-size: 1.1rem; line-height: 1.75; }
.client-proof-summary {
  display: grid;
  grid-template-columns: .65fr 1fr 1.45fr;
  gap: 12px;
  margin-top: 34px;
}
.client-proof-summary > div {
  display: grid;
  align-content: center;
  min-height: 112px;
  border: 1px solid #2c4056;
  border-radius: 14px;
  padding: 18px 20px;
  background: linear-gradient(145deg,#0e1b2c,#0a1725);
}
.client-proof-summary strong { color:#f7fbff; font-family:'Space Grotesk',sans-serif; font-size:clamp(1.35rem,2vw,2rem); line-height:1.1; }
.client-proof-summary span { color:#aebfd1; font-size:.78rem; line-height:1.5; margin-top:8px; }
.client-name-strip { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.client-name-strip a { color:#cfe5f5; border-bottom:1px solid #3e6078; padding:8px 4px; font-size:.78rem; text-decoration:none; }
.client-name-strip a:hover,.client-name-strip a:focus-visible { color:#fff; border-color:#15d9ff; }
.project-card { position:relative; scroll-margin-top:110px; }
.project-card::after { content:""; position:absolute; inset:0 auto auto 0; width:100%; height:3px; background:linear-gradient(90deg,#136cff,#15d9ff); opacity:.82; }
.website-card .project-visual,
.light-art .project-visual {
  background: radial-gradient(circle at 50% 42%,#17304a 0,#0b1b2c 58%,#06101b 100%);
  padding: 30px;
}
.website-card .project-visual img,
.light-art .project-visual img {
  border-radius: 10px;
  box-shadow: 0 16px 36px rgba(0,0,0,.36);
}
.dialog-image-stage { background:#081522; }
.project-client-label { margin-bottom:8px; }
.project-delivered {
  display:block;
  width:100%;
  border-top:1px solid #294158;
  color:#dce7f5;
  font-size:.78rem;
  line-height:1.55;
  margin-top:18px;
  padding-top:14px;
}
.project-delivered b { color:#8fdcff; font-weight:600; }
.client-live-panel {
  display:grid;
  grid-template-columns:minmax(230px,.78fr) minmax(0,1.6fr);
  gap:30px;
  margin-top:40px;
  padding:30px;
  border:1px solid #2c4056;
  border-radius:16px;
  background:linear-gradient(135deg,#0c1928,#102238);
}
.client-live-heading h3 { font-size:clamp(1.45rem,2.5vw,2rem); margin:10px 0; }
.client-live-heading p { color:#b8c8d9; line-height:1.65; margin:0; }
.client-live-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.client-live-grid a { display:grid; gap:5px; min-height:88px; align-content:center; border:1px solid #38536d; border-radius:12px; padding:16px 18px; color:#f4f7fb; text-decoration:none; background:#0c1a2a; }
.client-live-grid a:hover,.client-live-grid a:focus-visible { border-color:#15d9ff; transform:translateY(-2px); }
.client-live-grid strong { font-family:'Space Grotesk',sans-serif; }
.client-live-grid span { color:#8fdcff; font-size:.75rem; }
.client-live-panel .portfolio-case-link { grid-column:2; margin:4px 0 0; }
.client-live-panel .portfolio-case-link a { color:#cdeeff; text-underline-offset:4px; }
.client-care-panel { border-top:1px solid #2c4056; padding:56px 0 64px; }
.client-care-panel > h2 { max-width:760px; font-size:clamp(1.9rem,3.4vw,3rem); margin:12px 0 28px; }
.client-care-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.client-care-grid article { border:1px solid #2c4056; border-radius:14px; padding:24px; background:#0d1a2a; }
.client-care-grid article > span { color:#15d9ff; font:600 .72rem/1 'Space Grotesk',sans-serif; letter-spacing:.12em; }
.client-care-grid h3 { font-size:1.1rem; margin:14px 0 10px; }
.client-care-grid p { color:#b8c8d9; font-size:.86rem; line-height:1.65; margin:0; }

@media(max-width:900px) {
  .client-ribbon-inner { grid-template-columns:1fr; gap:16px; }
  .client-ribbon-cta { justify-self:start; }
}
@media(max-width:700px) {
  .client-ribbon-inner { padding-block:22px; }
  .client-ribbon-names { gap:7px; }
  .client-ribbon-names a { padding:7px 10px; font-size:.72rem; }
  .client-proof-summary { grid-template-columns:1fr; }
  .client-proof-summary > div { min-height:88px; }
  .client-live-panel { grid-template-columns:1fr; padding:22px; }
  .client-live-grid { grid-template-columns:1fr; }
  .client-live-panel .portfolio-case-link { grid-column:1; }
  .client-care-grid { grid-template-columns:1fr; }
  .website-card .project-visual,
  .light-art .project-visual { padding:18px; }
  body { padding-bottom:70px; }
  .lsx-ai-launcher {
    width:52px!important;
    height:52px!important;
    right:12px!important;
    bottom:12px!important;
    padding:0!important;
    font-size:0!important;
  }
  .lsx-ai-launcher::after { content:"AI"; font-size:13px; font-weight:700; }
}
@media(prefers-reduced-motion:reduce) { .client-live-grid a { transition:none; } }
