.work-page { background:#07111d; color:#f4f7fb; }
.work-page .container { width:min(1120px,calc(100% - 48px)); }
.work-page .section-label { color:#8fdcff; font-size:.68rem; letter-spacing:.17em; }
.portfolio-intro { padding-top:146px; padding-bottom:64px; }
.portfolio-wordmark { width:min(340px,90%); height:auto; mix-blend-mode:screen; margin-bottom:34px; }
.portfolio-intro h1 { font-size:clamp(2.4rem,4.8vw,4.5rem); line-height:1.08; margin:20px 0 24px; letter-spacing:-.035em; }
.portfolio-intro h1 span { color:#b7c9dc; }
.portfolio-intro p { max-width:660px; color:#bdcbdc; font-size:1.08rem; }
.portfolio-services { display:inline-block; color:#8fdcff; font-size:.87rem; margin-top:12px; text-decoration:underline; text-underline-offset:5px; }
.portfolio-projects { scroll-margin-top:100px; padding-bottom:72px; }
.portfolio-section-heading { display:flex; justify-content:space-between; align-items:baseline; gap:20px; border-top:1px solid #2b3c50; padding-top:26px; margin-bottom:28px; }
.portfolio-section-heading h2 { font-size:1.3rem; margin:0; }
.portfolio-section-heading p { color:#9eb1c6; font-size:.85rem; margin:0; }
.project-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.project-card { appearance:none; display:flex; flex-direction:column; text-align:left; padding:0; width:100%; border:1px solid #2c4056; border-radius:16px; overflow:hidden; background:#0e1b2c; color:inherit; cursor:pointer; box-shadow:0 12px 28px #0002; transition:transform .2s,border-color .2s,box-shadow .2s; }
.project-visual { display:flex; align-items:center; justify-content:center; padding:28px; background:#f7f5f0; height:350px; }
.project-visual img { width:100%; height:100%; object-fit:contain; }
.featured { grid-column:1/-1; display:grid; grid-template-columns:1.4fr 1fr; }
.featured .project-visual { height:340px; padding:0; background:#050709; }
.featured .project-visual img { object-fit:contain; }
.website-card .project-visual { padding:22px; background:#dce7ee; }
.wide { grid-column:1/-1; }
.wide .project-visual { height:230px; padding:38px; }
.dark-art .project-visual { background:#000; }
.project-copy { display:flex; flex-direction:column; padding:30px; align-items:flex-start; justify-content:center; }
.project-type { font-size:.62rem; color:#8fdcff; letter-spacing:.12em; line-height:1.8; }
.project-title { display:block; font-family:'Space Grotesk',sans-serif; font-size:clamp(1.35rem,2vw,1.8rem); font-weight:600; line-height:1.2; margin:14px 0; }
.project-description { color:#bdcbdc; font-size:.92rem; line-height:1.7; }
.project-action { color:#f4f7fb; font-size:.85rem; font-weight:600; margin-top:24px; display:flex; gap:16px; }
.project-action span { color:#15d9ff; }
.portfolio-contact { display:flex; justify-content:space-between; align-items:center; gap:30px; border-top:1px solid #2c4056; padding:40px 0 64px; }
.portfolio-contact h2 { font-size:clamp(1.8rem,3vw,2.6rem); margin:12px 0; }
.portfolio-contact p { color:#bdcbdc; max-width:550px; }
.work-page footer { background:#050c15; }
.work-page .main-nav a[aria-current="page"] { color:#15d9ff; }
.project-dialog { width:min(1000px,calc(100% - 32px)); max-height:calc(100dvh - 32px); border:1px solid #49627b; border-radius:18px; background:#0e1b2c; color:#f4f7fb; padding:28px; overscroll-behavior:contain; }
.project-dialog::backdrop { background:rgba(2,7,14,.88); }
.dialog-top { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.dialog-close,.gallery-controls button { border:1px solid #49627b; border-radius:8px; color:#f4f7fb; background:#14263a; min-height:44px; padding:8px 14px; cursor:pointer; }
.project-dialog h2 { font-size:clamp(1.4rem,3vw,2rem); margin:22px 0 8px; }
#dialog-description { color:#bdcbdc; max-width:750px; margin:0 0 12px; }
#dialog-live { color:#8fdcff; display:inline-block; text-decoration:underline; text-underline-offset:4px; margin-bottom:16px; }
#dialog-live[hidden] { display:none; }
.dialog-figure { margin:18px 0; }
.dialog-image-stage { display:flex; align-items:center; justify-content:center; height:min(51dvh,520px); padding:16px; border-radius:10px; background:#f7f5f0; }
.dialog-image-stage.dark { background:#000; }
#dialog-image { width:100%; height:100%; object-fit:contain; }
#dialog-caption { margin-top:14px; color:#bdcbdc; font-size:.85rem; text-align:center; }
.gallery-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.gallery-controls button:disabled { opacity:.4; cursor:default; }
#gallery-count { color:#bdcbdc; font-size:.8rem; }
.work-page :focus-visible { outline:3px solid #8fdcff; outline-offset:4px; }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip-link { position:fixed; top:-80px; left:16px; z-index:1000; padding:12px; background:#07111d; color:white; }
.skip-link:focus { top:12px; }
@media(hover:hover) and (pointer:fine) { .project-card:hover { transform:translateY(-3px); border-color:#68bbd0; box-shadow:0 18px 36px #0005; } }
@media(max-width:700px) {
 .work-page .container { width:calc(100% - 32px); }
 .portfolio-intro { padding-top:118px; padding-bottom:42px; }
 .portfolio-wordmark { width:270px; }
 .portfolio-section-heading { display:block; }
 .portfolio-section-heading p { margin-top:8px; }
 .project-grid { grid-template-columns:1fr; gap:22px; }
 .featured { display:flex; }
 .featured .project-visual { height:250px; }
 .project-visual { height:310px; padding:24px; }
 .wide .project-visual { height:170px; padding:22px; }
 .project-copy { padding:24px; }
 .portfolio-contact { flex-direction:column; align-items:flex-start; }
 .project-dialog { padding:18px; }
 .dialog-top .section-label { font-size:.55rem; letter-spacing:.08em; }
 .dialog-image-stage { height:40dvh; padding:8px; }
 .gallery-controls button { font-size:.8rem; padding:8px 10px; }
}
@media(prefers-reduced-motion:reduce) { html {scroll-behavior:auto;} .project-card {transition:none;} .project-card:hover {transform:none;} }
/* 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; } }
/* Portfolio 2.0: scoped layout; original brand artwork remains untouched. */
.work-page{background:radial-gradient(ellipse at 85% 4%,#11364b88,transparent 34%),#07111d;font-family:Inter,sans-serif;line-height:1.65}
.work-page *, .work-page *::before,.work-page *::after{box-sizing:border-box}
.work-page .container{width:min(1200px,calc(100% - 64px))}
.portfolio-intro{padding:160px 0 70px}.portfolio-intro h1{font-size:clamp(2.6rem,6vw,5.5rem);max-width:960px;letter-spacing:-.055em}.portfolio-intro h1 span{color:#9cdef2}.portfolio-intro>p{max-width:700px;font-size:1.08rem;line-height:1.8}.intro-actions{display:flex;gap:28px;align-items:center;flex-wrap:wrap;margin:30px 0 38px}.text-link{color:#b8ebff;text-underline-offset:6px;font-size:.88rem;font-weight:600}.client-name-strip{gap:12px 22px}.client-name-strip a{font-size:.8rem;padding:10px 0}.portfolio-section-heading{padding-top:26px;margin-bottom:34px}.portfolio-section-heading h2{font-size:1.4rem}
.client-project{border:1px solid #30485b;border-radius:20px;overflow:hidden;background:linear-gradient(120deg,#102336,#0b1826);margin-bottom:38px;scroll-margin-top:110px;box-shadow:0 20px 50px #0002;display:grid;grid-template-columns:minmax(0,1.14fr) minmax(0,1fr)}
.project-media{position:relative;display:flex;flex-direction:column;justify-content:center;min-width:0;background:radial-gradient(ellipse at center,#28445d,#101f2e 75%);padding:36px 30px 24px;gap:24px}.art-preview{display:flex;align-items:center;justify-content:center;min-height:330px}.art-preview img{width:100%;height:330px;object-fit:contain;border-radius:8px}.media-label{color:#bbcedf;font-size:.65rem;letter-spacing:.07em;text-align:center}.site-preview{position:relative;padding:5% 12% 7% 0}.browser-frame{border:1px solid #547086;border-radius:9px;overflow:hidden;background:#10202e;box-shadow:0 18px 35px #0005}.browser-bar{height:28px;display:flex;align-items:center;gap:4px;padding:0 10px;background:#192e40}.browser-bar i{height:5px;width:5px;background:#7391a7;border-radius:50%}.browser-bar span{font-size:8px;color:#c2d3df;margin-left:10px}.browser-frame img{display:block;width:100%;height:auto}.phone-frame{position:absolute;right:0;bottom:0;width:24%;border:5px solid #081019;border-radius:19px;overflow:hidden;box-shadow:0 12px 30px #0007;outline:1px solid #547086;background:#081019}.phone-frame img{display:block;width:100%;height:auto}
.project-story{padding:36px;min-width:0}.project-eyebrow{display:flex;flex-direction:column;gap:8px;font-size:.58rem;letter-spacing:.12em;color:#96d5ed}.project-eyebrow>span:first-child{color:#91a6b9}.project-story h3{font:600 clamp(1.6rem,2.5vw,2.2rem)/1.14 'Space Grotesk',sans-serif;letter-spacing:-.03em;margin:20px 0 12px}.project-story .project-headline{color:#e5f4ff;font-size:1rem;margin:0 0 14px}.project-story>p{color:#b5c7d8;font-size:.88rem;line-height:1.75}.project-deliverables{border-top:1px solid #2b4357;border-bottom:1px solid #2b4357;padding:14px 0;margin:20px 0;color:#9fd8ee;font-size:.72rem}.project-buttons{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.gallery-open{background:#c6eeff;color:#081722;border:0;cursor:pointer;min-height:46px;padding:12px 18px;border-radius:7px;font-size:.85rem;font-weight:700;display:flex;gap:16px}.case-study{margin-top:24px;border-top:1px solid #2b4357;font-size:.85rem}.case-study summary{cursor:pointer;padding:17px 0;color:#d1e8f4;min-height:48px}.case-study h4{font-size:.8rem;color:#a0ddf4;margin:18px 0 5px}.case-study p{color:#b5c7d8;line-height:1.8;margin:0}.case-links{display:flex;flex-wrap:wrap;gap:16px;margin-top:20px}.case-links a,#dialog-links a{color:#a7e6ff;text-underline-offset:4px;font-size:.83rem}.dialog-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}#dialog-links{display:flex;gap:18px;flex-wrap:wrap}.project-dialog{max-width:1100px;overflow:auto}.dialog-image-stage{position:relative;height:min(55dvh,580px);background:#081522}.dialog-image-stage:has(img[hidden]){min-height:150px}#gallery-error{color:#fff;text-align:center}#gallery-thumbnails{display:flex;gap:9px;overflow-x:auto;padding:16px 4px 8px}#gallery-thumbnails button{flex:0 0 76px;width:76px;height:62px;border:1px solid #4a647b;border-radius:6px;background:#081522;cursor:pointer;padding:4px}#gallery-thumbnails button[aria-pressed=true]{border:2px solid #9ce6ff}#gallery-thumbnails img{width:100%;height:100%;object-fit:contain}.work-page [hidden]{display:none!important}.dialog-close{white-space:nowrap}.client-care-panel>h2{font-size:clamp(1.8rem,3vw,2.6rem)}
@media(min-width:1000px){.client-project:nth-of-type(even) .project-media{order:2}.client-project:nth-of-type(even){grid-template-columns:minmax(0,1fr) minmax(0,1.14fr)}}
@media(max-width:800px){.work-page .container{width:calc(100% - 32px)}.portfolio-intro{padding-top:120px;padding-bottom:42px}.client-project{grid-template-columns:1fr;margin-bottom:26px;border-radius:14px}.project-media{padding:28px 24px 20px}.project-story{padding:25px}.art-preview{min-height:230px}.art-preview img{height:260px}.site-preview{max-width:600px;width:100%;margin:auto}.portfolio-section-heading{display:block}.portfolio-section-heading p{margin-top:8px}.intro-actions{gap:20px}.project-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);padding:16px}.dialog-image-stage{height:42dvh}.project-dialog h2{line-height:1.2}.dialog-top .section-label{max-width:62%}.project-buttons .text-link{font-size:.82rem}.client-care-grid{grid-template-columns:1fr}.portfolio-contact{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.client-project,.gallery-open{transition:none}}

/* Project inquiry additions; existing gallery and brand styles are preserved. */
.project-inquiry,#dialog-inquiry{display:inline-flex;align-items:center;min-height:44px}
.inquiry-note{font-size:.78rem;color:#b5c7d8;line-height:1.6;margin:8px 0 18px}
.portfolio-contact-actions{display:flex;flex-direction:column;align-items:flex-start;gap:16px;flex-shrink:0}
.project-inquiry:focus-visible,#dialog-inquiry:focus-visible{outline:2px solid #9ce6ff;outline-offset:5px;border-radius:3px}