:root {
  --gold:#d7a52e;
  --gold-light:#f1c45d;
  --bg:#020202;
  --text:#f4f1e8;
}
* { box-sizing:border-box; }
html { background:var(--bg); scroll-behavior:smooth; }
body {
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at 50% 0%, rgba(215,165,46,.10), transparent 34%),
    #020202;
  font-family:Arial, Helvetica, sans-serif;
  overflow-x:hidden;
}
.page-shell {
  width:min(100vw,1024px);
  margin:0 auto;
  position:relative;
  background:#000;
  box-shadow:0 0 80px rgba(0,0,0,.82);
}
.card {
  display:block;
  width:100%;
  height:auto;
  user-select:none;
  -webkit-user-drag:none;
}
.hotspot {
  position:absolute;
  display:block;
  border:1px solid transparent;
  border-radius:6px;
  cursor:pointer;
  transition:.22s ease;
  background:transparent;
}
.hotspot:hover,
.hotspot:focus-visible {
  border-color:rgba(215,165,46,.9);
  background:rgba(215,165,46,.04);
  box-shadow:
    0 0 0 3px rgba(215,165,46,.12),
    0 0 30px rgba(215,165,46,.22);
  outline:none;
}
.hotspot::after {
  content:attr(data-tip);
  position:absolute;
  left:50%;
  bottom:10px;
  transform:translate(-50%,8px);
  padding:7px 10px;
  border:1px solid rgba(215,165,46,.75);
  border-radius:5px;
  background:rgba(0,0,0,.92);
  color:var(--gold-light);
  font-size:12px;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:.18s ease;
}
.hotspot:hover::after,
.hotspot:focus-visible::after {
  opacity:1;
  transform:translate(-50%,0);
}
.work-types { left:1.95%; top:10.22%; width:41.6%; height:47.0%; }
.examples { left:44.63%; top:7.55%; width:53.3%; height:50.75%; }
.prep { left:1.95%; top:61.72%; width:31.1%; height:12.55%; }
.extras { left:33.69%; top:61.72%; width:34.2%; height:12.55%; }
.important { left:68.75%; top:61.72%; width:29.1%; height:12.55%; }
.surfaces { left:1.95%; top:74.74%; width:95.9%; height:8.3%; }
.objects { left:1.95%; top:83.46%; width:95.9%; height:9.45%; }
.cta { left:1.95%; top:93.15%; width:95.9%; height:5.65%; }

.modal {
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(0,0,0,.92);
}
.modal.open { display:flex; }
.modal-card {
  width:min(1100px,96vw);
  max-height:94vh;
  overflow:auto;
  background:#070707;
  border:1px solid var(--gold);
  box-shadow:0 0 70px rgba(215,165,46,.24);
}
.modal-top {
  position:sticky;
  top:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 13px;
  background:rgba(5,5,5,.97);
  border-bottom:1px solid rgba(215,165,46,.45);
}
.modal-title {
  color:var(--gold-light);
  font-weight:700;
  letter-spacing:.03em;
}
.modal-close {
  border:1px solid var(--gold);
  background:#0a0a0a;
  color:var(--gold-light);
  padding:7px 12px;
  border-radius:4px;
  cursor:pointer;
  font-weight:700;
}
.modal-image {
  display:block;
  width:100%;
  height:auto;
}
@media (max-width:700px) {
  .hotspot::after { display:none; }
}

.real-case{width:min(100vw,1024px);margin:0 auto;background:#020202;color:#f4f1e8;padding:14px 18px 22px;border-top:1px solid rgba(215,165,46,.55)}
.real-case h2{margin:0 0 14px;color:#e1ad3e;font-family:Georgia,"Times New Roman",serif;font-size:24px;text-align:center;letter-spacing:.04em}
.case-card{border:1px solid rgba(215,165,46,.78);background:linear-gradient(180deg,#0b0b0b,#050505);box-shadow:inset 0 0 24px rgba(215,165,46,.03)}
.case-head{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:start;padding:14px 16px;border-bottom:1px solid rgba(215,165,46,.4)}
.case-title{color:#e2ad3f;font-family:Georgia,"Times New Roman",serif;font-size:22px;margin:0 0 5px}
.case-desc{margin:0;color:#ddd6c8;line-height:1.45;font-size:14px}.case-tag{border:1px solid #d7a52e;color:#f2c45d;padding:9px 11px;border-radius:5px;font-weight:700;white-space:nowrap}
.case-list{margin:0;padding:12px 18px 4px 36px;color:#e7e2d8;line-height:1.55;font-size:14px}
.case-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px}.case-gallery figure{margin:0;border:1px solid rgba(215,165,46,.7);background:#070707;min-width:0}.case-gallery button{all:unset;display:block;cursor:pointer;width:100%}.case-gallery img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#111}.case-gallery figcaption{padding:8px 9px 10px;color:#f0c05c;font-size:12px;line-height:1.3;text-align:center}
.case-note{margin:0 10px 12px;padding:10px 12px;border:1px solid rgba(215,165,46,.35);color:#cfc7b8;font-size:13px;line-height:1.45}
.case-lightbox{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.92)}.case-lightbox.open{display:flex}.case-lightbox-card{width:min(1100px,96vw);max-height:94vh;overflow:auto;background:#070707;border:1px solid #d7a52e;box-shadow:0 0 70px rgba(215,165,46,.22)}.case-lightbox-top{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;background:rgba(5,5,5,.97);border-bottom:1px solid rgba(215,165,46,.45)}.case-lightbox-title{color:#f1c45d;font-weight:700}.case-lightbox-close{border:1px solid #d7a52e;background:#0a0a0a;color:#f1c45d;padding:7px 11px;border-radius:4px;cursor:pointer}.case-lightbox img{display:block;width:100%;height:auto}
@media(max-width:760px){.case-head{grid-template-columns:1fr}.case-tag{justify-self:start}.case-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---- extracted style block ---- */

.ramerk-card-switch{position:fixed;top:50%;transform:translateY(-50%);z-index:2147483000;width:74px;height:118px;display:flex;align-items:center;justify-content:center;text-decoration:none;color:#d8a84f;background:linear-gradient(180deg,rgba(8,7,5,.88),rgba(2,2,2,.94));border:1px solid rgba(216,168,79,.42);box-shadow:0 12px 42px rgba(0,0,0,.55),inset 0 0 22px rgba(216,168,79,.035);font:400 36px/1 Georgia,serif;transition:width .25s ease,background .25s ease,color .25s ease,border-color .25s ease;backdrop-filter:blur(5px)}
  .ramerk-card-switch.prev{left:18px}.ramerk-card-switch.next{right:18px}
  .ramerk-card-switch span{position:absolute;top:calc(100% + 8px);white-space:nowrap;font:600 9px/1.2 Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:rgba(244,211,127,.78);opacity:0;transition:opacity .2s ease}
  .ramerk-card-switch:hover,.ramerk-card-switch:focus-visible{width:88px;color:#f4d37f;background:linear-gradient(180deg,rgba(34,24,10,.96),rgba(5,4,3,.98));border-color:rgba(244,211,127,.9);outline:none}
  .ramerk-card-switch:hover span,.ramerk-card-switch:focus-visible span{opacity:1}
  .ramerk-card-home{position:fixed;right:18px;bottom:18px;z-index:2147483000;padding:12px 16px;color:#d8a84f;text-decoration:none;background:rgba(3,3,3,.9);border:1px solid rgba(216,168,79,.42);font:600 9px/1 Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase}
  .ramerk-zoomable{cursor:zoom-in!important;transition:filter .25s ease,transform .25s ease!important}
  .ramerk-zoomable:hover{filter:brightness(1.08) contrast(1.03);}
  #ramerk-lightbox{position:fixed;inset:0;z-index:2147483646;display:none;align-items:center;justify-content:center;padding:42px;background:rgba(0,0,0,.94);cursor:zoom-out}
  #ramerk-lightbox.open{display:flex}
  #ramerk-lightbox img{max-width:96vw;max-height:92vh;width:auto!important;height:auto!important;object-fit:contain!important;position:static!important;transform:none!important;filter:none!important;border:1px solid rgba(216,168,79,.55);box-shadow:0 24px 90px rgba(0,0,0,.85)}
  #ramerk-lightbox button{position:fixed;right:22px;top:20px;width:46px;height:46px;border:1px solid rgba(216,168,79,.6);background:#090806;color:#f4d37f;font-size:25px;cursor:pointer}
  @media(max-width:900px){.ramerk-card-switch{width:48px;height:82px;font-size:27px}.ramerk-card-switch.prev{left:6px}.ramerk-card-switch.next{right:6px}.ramerk-card-switch span{display:none}.ramerk-card-home{right:8px;bottom:8px;padding:10px;font-size:8px}#ramerk-lightbox{padding:18px}}

/* Keep every solution card below the fixed site header. */
body.ramerk-has-global { padding-top: 110px !important; }
