/* Project-specific styling for the EBox Permit case study and featured GameLens card. */
.gamelens-feature-cover {
  height: 560px;
  padding: 32px 38px;
  background: radial-gradient(ellipse at 76% 74%, #2a597b, transparent 68%), #0c1725;
}
.gamelens-feature-cover .gamelens-web-copy { padding-top: 43px; }
.gamelens-feature-cover .gamelens-web-copy h3 { font-size: clamp(70px, 8vw, 112px); }
.gamelens-feature-cover .gamelens-web-copy p { font-size: 16px; }
.gamelens-feature-cover .gamelens-web-window { width: 69%; right: -3%; bottom: -38%; transform: rotate(-5deg); }
.project-card:hover .gamelens-feature-cover .gamelens-web-window { transform: rotate(-2deg) translateY(-8px); }
.gamelens-featured .project-caption { padding-top: 20px; }
.ebox-cover {
  color: #f5fbff;
  background: radial-gradient(ellipse at 78% 45%, #2f6e8e 0%, transparent 54%), linear-gradient(135deg, #12364d 0%, #0d293d 60%, #112f45 100%);
}
.ebox-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .22;
  background: linear-gradient(90deg, transparent 49.8%, #a8d8ec 50%, transparent 50.2%), linear-gradient(0deg, transparent 49.8%, #a8d8ec 50%, transparent 50.2%);
  background-size: 52px 52px;
  mask-image: linear-gradient(110deg, transparent, #000 78%);
}
.ebox-cover .cover-meta, .ebox-cover .cover-bottom, .ebox-cover-copy, .ebox-cover-features { z-index: 2; }
.ebox-cover .cover-meta { color: #c1e1ee; }
.ebox-cover-copy { position: relative; margin-top: 38px; width: 44%; }
.ebox-cover-copy h3 { margin: 0 0 15px; font: normal clamp(52px, 6vw, 82px)/.92 var(--serif); letter-spacing: -.045em; }
.ebox-cover-copy h3 em { color: #93d9f1; font-weight: 400; }
.ebox-cover-copy p { color: #c5dce7; font-size: 15px; line-height: 1.75; }
.ebox-cover-photo { position: absolute; z-index: 1; width: 52%; height: 70%; right: 0; top: 12%; overflow: hidden; border: 1px solid #c3e8f255; border-radius: 44% 0 0 44%; box-shadow: -24px 22px 60px #061d2c70; }
.ebox-cover-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 48% center; }
.ebox-cover-features { position: absolute; left: 38px; bottom: 67px; display: flex; gap: 8px; flex-wrap: wrap; max-width: 47%; }
.ebox-cover-features span { border: 1px solid #a9d9ec55; border-radius: 30px; padding: 8px 11px; color: #d0e8f2; background: #163b5266; font-size: 10px; }
.ebox-cover .cover-bottom { color: #b5d4e2; }
.case-hero.ebox-live-hero { height: 450px; color: #f3faff; background: radial-gradient(ellipse at 77% 45%, #347b9d 0%, transparent 60%), linear-gradient(135deg, #12364d, #0d293d 72%); }
.ebox-live-hero .case-hero-copy { position: relative; z-index: 2; width: 48%; }
.ebox-live-hero .case-hero-copy h2 { color: #f5fbff; }
.ebox-live-hero .case-hero-copy h2 { white-space: nowrap; font-size: clamp(54px, 6vw, 78px); letter-spacing: -.055em; }
.ebox-live-hero .case-hero-copy p { color: #d0e6ef; }
.ebox-live-hero .case-hero-copy p em { color: #92d9f1; font: italic 1.25em var(--serif); }
.ebox-live-hero .case-hero-tag { color: #c2dce7; font-size: 10px; white-space: nowrap; }
.ebox-case-photo { position: absolute; right: -2%; bottom: -7%; width: 57%; height: 83%; overflow: hidden; border: 1px solid #c5e6f140; border-radius: 46% 0 0 0; box-shadow: -20px 18px 55px #061b2a60; }
.ebox-case-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 46% center; }
.ebox-feature-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 36px 0 0; }
.ebox-feature-list article { min-height: 174px; border-top: 1px solid #cfe3ed; padding: 22px 18px 19px 0; }
.ebox-feature-list img { width: 30px; height: 30px; object-fit: contain; margin-bottom: 16px; }
.ebox-feature-list h4 { margin: 0 0 8px; font: 500 20px/1.2 var(--sans); color: #19465e; }
.ebox-feature-list p { max-width: 35ch; margin: 0; color: #668596; font-size: 14px; line-height: 1.7; }
@media (max-width: 900px) {
  .gamelens-feature-cover { height: 470px; padding: 26px; }
  .gamelens-feature-cover .gamelens-web-copy { padding-top: 22px; }
  .gamelens-feature-cover .gamelens-web-window { width: 78%; right: -6%; bottom: -25%; }
  .ebox-cover-copy { margin-top: 28px; }
  .ebox-cover-features { left: 26px; max-width: 45%; }
}
@media (max-width: 760px) {
  .gamelens-feature-cover { height: 410px; }
  .gamelens-feature-cover .gamelens-web-copy h3 { font-size: 62px; }
  .gamelens-feature-cover .gamelens-web-window { width: 94%; right: -13%; bottom: -17%; }
  .ebox-cover { height: 430px; padding: 23px; }
  .ebox-cover-copy { margin-top: 23px; width: 61%; }
  .ebox-cover-copy h3 { font-size: 53px; }
  .ebox-cover-photo { width: 55%; height: 48%; top: auto; bottom: 11%; opacity: .88; }
  .ebox-cover-features { left: 23px; bottom: 60px; max-width: 55%; }
  .ebox-cover-features span { font-size: 9px; padding: 7px 9px; }
  .ebox-live-hero .case-hero-copy { width: 100%; }
  .case-hero.ebox-live-hero { height: 360px; }
  .ebox-live-hero .case-hero-copy h2 { font-size: 52px; }
  .ebox-live-hero .case-hero-tag { white-space: normal; max-width: 210px; }
  .ebox-case-photo { width: 73%; height: 47%; right: -10%; bottom: -4%; opacity: .78; }
  .ebox-feature-list { grid-template-columns: 1fr; gap: 4px; }
  .ebox-feature-list article { min-height: 0; padding: 19px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .gamelens-feature-cover .gamelens-web-window { transform: none; }
}

/* EBox is presented as a miniature responsive website, not a photo cover. */
.ebox-cover { background: linear-gradient(145deg,#eaf7fc,#cbeaf5 55%,#b9e1ef); color:#184b65; }
.ebox-cover::after { content:none; }
.ebox-cover-meta { z-index:3; color:#426e82!important; }
.ebox-cover .cover-bottom { z-index:3; color:#4b7588; }
.ebox-browser-preview {
  position:absolute; z-index:1; inset:68px 5% 53px; overflow:hidden;
  border:1px solid #fff; border-radius:13px; background:#fff;
  box-shadow:0 18px 40px #2b708b20; color:#244f64;
}
.ebox-browser-top { height:25px; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 10px; background:#f3f9fb; border-bottom:1px solid #e1edf2; color:#7391a0; font:500 8px/1 var(--sans); }
.ebox-browser-dots { display:flex; gap:3px; }
.ebox-browser-dots i { width:5px; height:5px; border-radius:50%; background:#a9d7e7; }
.ebox-browser-action { color:#3c738a; }
.ebox-site-nav { height:41px; display:flex; align-items:center; justify-content:space-between; gap:9px; padding:0 13px; border-bottom:1px solid #edf3f6; color:#678391; font:500 8px/1 var(--sans); white-space:nowrap; }
.ebox-site-nav img { width:44px; height:30px; object-fit:contain; }
.ebox-site-nav b { padding:8px 10px; border-radius:20px; background:#e0f4fb; color:#176384; font-size:8px; font-weight:600; }
.ebox-site-nav b i,.ebox-site-copy a i,.ebox-case-copy a i { font-style:normal; }
.ebox-site-hero { min-height:calc(100% - 91px); display:grid; grid-template-columns:.92fr 1.08fr; align-items:center; gap:8px; padding:17px 15px 13px; overflow:hidden; }
.ebox-site-copy>span,.ebox-case-copy>span { color:#55869d; font:650 7px/1.4 var(--sans); letter-spacing:.12em; }
.ebox-site-copy h3 { margin:7px 0 7px; color:#183e54; font:500 clamp(22px,3vw,38px)/.98 var(--serif); letter-spacing:-.045em; }
.ebox-site-copy h3 em,.ebox-case-copy h3 em { color:#1695c2; font-weight:400; }
.ebox-site-copy p { max-width:28ch; margin:0 0 10px; color:#678391; font:400 8px/1.5 var(--sans); }
.ebox-site-copy a,.ebox-case-copy a { display:inline-flex; align-items:center; gap:8px; color:#147ca5; font:600 8px/1 var(--sans); }
.ebox-site-visual { height:100%; min-height:120px; position:relative; }
.ebox-site-visual>img { width:100%; height:100%; object-fit:cover; border-radius:8px; }
.ebox-mini-device { position:absolute; width:24%; height:69%; right:5%; bottom:0; overflow:hidden; border:3px solid #f8fdff; border-radius:9px; background:#fff; box-shadow:0 6px 16px #123c5233; }
.ebox-mini-device img { width:100%; height:100%; object-fit:cover; object-position:top; }
.ebox-site-proof { display:none; }
.ebox-live-hero .case-hero-copy { width:36%; }
.ebox-live-hero .case-hero-copy h2 { white-space:normal; font-size:clamp(50px,5.5vw,76px); }
.ebox-case-browser { position:absolute; z-index:3; right:3%; top:39px; bottom:39px; width:58%; overflow:hidden; border:1px solid #d7e9f0; border-radius:12px; background:#fff; box-shadow:0 24px 60px #061d2c55; color:#244f64; }
.ebox-case-browser .ebox-browser-top { height:31px; padding-inline:14px; font-size:9px; }
.ebox-case-page { height:calc(100% - 31px); }
.ebox-case-browser .ebox-site-nav { height:48px; padding-inline:18px; font-size:9px; }
.ebox-case-browser .ebox-site-nav img { width:58px; height:36px; }
.ebox-case-browser .ebox-site-nav b { font-size:9px; }
.ebox-case-main { height:calc(100% - 48px); display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:14px; padding:20px 20px 16px; }
.ebox-case-copy>span { font-size:8px; }
.ebox-case-copy h3 { margin:9px 0; color:#183e54; font:500 clamp(24px,2.3vw,34px)/.98 var(--serif); letter-spacing:-.045em; }
.ebox-case-copy p { max-width:32ch; margin:0 0 14px; color:#688697; font:400 11px/1.55 var(--sans); }
.ebox-case-copy a { font-size:10px; }
.ebox-case-visual { height:100%; min-height:210px; position:relative; }
.ebox-case-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border:0; border-radius:10px; box-shadow:none; }
.ebox-case-screen { position:absolute; width:24%; height:78%; left:5%; bottom:-3%; overflow:hidden; border:4px solid #fff; border-radius:14px; background:white; box-shadow:0 12px 28px #092c3c45; }
.ebox-case-screen img { width:100%; height:100%; object-fit:cover; object-position:top; }
.ebox-case-qr { position:absolute; width:16%; height:37%; right:4%; bottom:5%; overflow:hidden; border:3px solid #fff; border-radius:8px; box-shadow:0 10px 22px #092c3c40; }
.ebox-case-qr img { width:100%; height:100%; object-fit:cover; object-position:center 48%; }
.ebox-case-proof { display:none; }
@media (max-width:900px) {
  .ebox-live-hero .case-hero-copy { width:100%; }
  .ebox-case-browser { right:3%; width:59%; }
}
@media (max-width:760px) {
  .ebox-cover { height:430px; padding:23px; }
  .ebox-cover-meta { top:22px; left:23px; right:23px; }
  .ebox-browser-preview { inset:66px 4% 53px; }
  .ebox-case-browser { left:4%; right:4%; top:auto; bottom:15px; width:92%; height:54%; }
  .ebox-live-hero .case-hero-copy { width:100%; }
  .ebox-live-hero .case-hero-copy h2 { font-size:48px; }
  .ebox-case-browser .ebox-site-nav { gap:5px; padding-inline:9px; font-size:7px; }
  .ebox-case-browser .ebox-site-nav img { width:39px; }
  .ebox-case-main { gap:7px; padding:12px; }
  .ebox-case-copy>span { font-size:6px; }
  .ebox-case-copy h3 { font-size:clamp(17px,4.8vw,24px); }
  .ebox-case-copy p { font-size:8px; }
  .ebox-case-visual { min-height:80px; }
}