/* Three genuinely different self-authored case illustrations. No raster assets. */
.case-art{width:100%;height:100%;min-height:365px;position:relative;font-family:var(--cas-ui)}
.case-art small{font-weight:800;font-size:9px;letter-spacing:.09em}
.case-art-record{background:radial-gradient(circle at 85% 82%,#c8e4cc80,transparent 44%);padding:25px 0}
.record-stage-kicker,.jewel-labelling,.operations-flow-title{display:flex;justify-content:space-between;gap:10px;font-size:10px;letter-spacing:.12em;font-weight:850;position:relative;z-index:3}
.record-stage-paper{position:absolute;top:72px;bottom:40px;left:2%;width:76%;background:#fff;border:1px solid #e5e8ec;border-radius:10px;box-shadow:20px 21px 32px #15224226;padding:clamp(17px,2vw,35px);transform:rotate(-4deg)}
.record-stage-paper>span{color:#536c8d;font-size:10px;font-weight:850;letter-spacing:.1em}
.record-stage-paper>strong{display:block;font-size:clamp(19px,2.8vw,37px);letter-spacing:-.055em;margin:25px 0 11px}
.record-stage-paper>p{font-size:12px;line-height:1.45;color:#55657b;max-width:24ch;margin:0 0 22px}
.record-data{display:flex;justify-content:space-between;gap:8px;padding:9px 0;border-bottom:1px solid #e1e8f1;font-size:9px}
.record-data span{font-weight:750;color:#60718c;letter-spacing:.04em}.record-data b{color:#234a84;text-align:right}
.record-stage-slip{position:absolute;right:0;bottom:28px;width:34%;height:42%;padding:16px 12px;background:#eff8f3;border:1px solid #91bfb0;border-radius:8px;transform:rotate(9deg);box-shadow:12px 12px 20px #14203328;z-index:2}
.record-stage-slip span{font-size:9px;font-weight:850;letter-spacing:.08em;color:#356454}
.record-stage-slip b{display:block;font-size:18px;letter-spacing:-.04em;margin:15px 0}
.record-stage-slip i{display:block;width:95%;height:4px;background:#abcfc4;margin:9px 0}.record-stage-slip i:nth-last-child(1){width:52%}
.record-stage-seal{position:absolute;right:-8px;top:85px;border:2px solid #335ae5;border-radius:100%;width:105px;height:105px;display:grid;place-items:center;text-align:center;color:#254cbb;background:#f1f5fd;transform:rotate(15deg);font-weight:900;font-size:11px;letter-spacing:.03em;line-height:1.2;z-index:2}
.case-body[data-theme="jewellery"] .case-visual{padding:20px;min-height:480px}
.case-art-jewel{height:420px;min-height:420px;isolation:isolate}
.case-art-jewel:before{content:"";position:absolute;inset:-3%;background:radial-gradient(ellipse at 53% 48%,#ffe9ad3d,transparent 42%),radial-gradient(ellipse at 20% 80%,#8a4e3544,transparent 45%);pointer-events:none}
.jewel-labelling{color:#f6d8a6;position:absolute;top:15px;left:15px;right:15px}
.jewel-metal-band{position:absolute;left:50%;top:58%;width:clamp(215px,22vw,330px);height:clamp(125px,14vw,185px);transform:translate(-50%,-50%) rotate(-23deg);border-radius:50%;background:conic-gradient(from 7deg,#70482d,#fbe4a7 15%,#a77a4d 30%,#fde8b3 42%,#745236 56%,#e2aa68 73%,#6d452e 90%,#b58a58);box-shadow:0 27px 24px #0008}
.jewel-metal-inset{position:absolute;left:50%;top:58%;width:clamp(170px,17.5vw,268px);height:clamp(85px,9vw,121px);transform:translate(-50%,-50%) rotate(-23deg);border-radius:50%;background:#172333;box-shadow:inset 0 9px 9px #000a,0 0 0 2px #ffe4a866}
.jewel-stone-shape{position:absolute;left:51%;top:43%;width:clamp(105px,12vw,172px);height:clamp(156px,17vw,245px);transform:translate(-50%,-50%) rotate(6deg);clip-path:polygon(50% 0%,78% 20%,91% 46%,80% 77%,50% 100%,20% 77%,9% 46%,22% 20%);background:linear-gradient(145deg,#f2ffff,#94d5d8 32%,#24647f 67%,#e2e7d0 100%);box-shadow:inset 0 0 0 9px #fcf3dbaa}
.jewel-stone-shape:before{content:"";position:absolute;inset:0;background:linear-gradient(35deg,transparent 40%,#ffffffa9 47%,transparent 56%),linear-gradient(150deg,#fff8 12%,transparent 40%);z-index:2}
.jewel-cut{position:absolute;display:block}
.jewel-cut.a{inset:0;clip-path:polygon(50% 0,50% 40%,7% 48%);background:#fcfff1ad}
.jewel-cut.b{inset:0;clip-path:polygon(50% 0,90% 46%,50% 40%);background:#58acc29b}
.jewel-cut.c{inset:0;clip-path:polygon(7% 48%,50% 40%,50% 100%,20% 78%);background:#c9fff1b8}
.jewel-cut.d{inset:0;clip-path:polygon(50% 40%,90% 46%,80% 78%,50% 100%);background:#265d839e}
.jewel-cut.e{inset:0;clip-path:polygon(20% 78%,50% 100%,80% 78%);background:#eaf8eaba}
.jewel-annotation{position:absolute;bottom:11px;left:14px;right:14px;display:flex;align-items:baseline;gap:13px;z-index:4;border-top:1px solid #d4b88d66;padding-top:12px}
.jewel-annotation span{font-size:9px;letter-spacing:.12em;color:#d7aa78}
.jewel-annotation b{font-size:15px;color:#f7e7ce;letter-spacing:-.03em}
.jewel-annotation small{margin-left:auto;color:#a9bac5;white-space:nowrap}
.case-body[data-theme="backoffice"] .case-visual{padding:24px;min-height:465px}
.case-art-operations{height:400px;min-height:400px;padding:8px}
.operations-flow-title{font-size:10px;color:#19433e}
.operations-flow-message{position:absolute;left:2%;top:73px;width:68%;background:#122d32;color:#f5f7f4;padding:27px 24px;border-radius:17px 17px 17px 3px;transform:rotate(-3deg);box-shadow:16px 15px 0 #33787838}
.operations-flow-message span{font-size:9px;letter-spacing:.13em;font-weight:750;color:#83e1cd}
.operations-flow-message strong{font-size:clamp(21px,2.5vw,34px);font-weight:900;line-height:1.12;letter-spacing:-.05em;display:block;margin-top:15px}
.operations-flow-spine{position:absolute;left:54%;top:176px;width:2px;height:91px;background:#2d8b79;transform:rotate(-13deg);z-index:2}
.operations-flow-spine:after{content:"";display:block;width:10px;height:10px;background:#186c5d;position:absolute;left:-4px;bottom:0;border-radius:50%}
.operations-flow-paper{position:absolute;right:3%;bottom:66px;width:66%;background:#fffdf5;color:#142b30;padding:18px 21px;border:1px solid #c7ccc0;box-shadow:15px 16px 0 #526b4344;transform:rotate(4deg);border-radius:7px}
.operations-flow-paper span{font-size:10px;letter-spacing:.13em;font-weight:850;color:#3b7967}
.operations-flow-paper strong{display:block;font-size:clamp(23px,2.7vw,37px);letter-spacing:-.06em;line-height:1.06;margin:16px 0}
.operations-flow-paper p{font-size:13px;line-height:1.4;margin:0 0 17px;max-width:28ch}
.operations-flow-paper b{font-size:10px;letter-spacing:.1em;border:1px solid #aaa;padding:6px 8px;color:#335d56}
.operations-flow-foot{position:absolute;bottom:9px;left:9px;right:9px;display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:9px;font-weight:900;letter-spacing:.06em}
.operations-flow-foot i{height:1px;min-width:6px;flex:1;background:#315e5b;opacity:.6}
@media(max-width:980px){
 .jewel-metal-band{width:330px;height:180px}
 .jewel-metal-inset{width:267px;height:120px}
 .jewel-stone-shape{width:170px;height:240px}
 .record-stage-paper{width:75%}
}
@media(max-width:480px){
 .case-art{min-height:285px;height:285px}
 .case-art-record{padding:10px 0}
 .record-stage-paper{top:38px;bottom:12px;left:0;width:78%;padding:13px}
 .record-stage-paper>strong{font-size:20px;margin:15px 0 9px}
 .record-stage-paper>p{font-size:10px;margin-bottom:8px}
 .record-stage-slip{width:36%;height:43%;right:-7px;bottom:3px;padding:10px}
 .record-stage-slip b{font-size:14px;margin:8px 0}
 .record-stage-seal{width:64px;height:64px;font-size:7px;right:-6px;top:40px}
 .record-data{font-size:8px;padding:6px 0}
 .record-stage-kicker,.jewel-labelling,.operations-flow-title{font-size:8px}
 .case-art-jewel{height:320px;min-height:320px}
 .case-body[data-theme="jewellery"] .case-visual{min-height:365px}
 .jewel-metal-band{width:225px;height:136px}
 .jewel-metal-inset{width:180px;height:96px}
 .jewel-stone-shape{width:120px;height:165px}
 .jewel-annotation{display:block}
 .jewel-annotation span{display:block;margin-bottom:4px}
 .jewel-annotation b{font-size:12px}
 .jewel-annotation small{display:block;margin-top:4px}
 .case-art-operations{height:310px;min-height:310px}
 .case-body[data-theme="backoffice"] .case-visual{min-height:370px;padding:15px}
 .operations-flow-message{top:43px;width:78%;padding:17px 15px}
 .operations-flow-message strong{font-size:21px}
 .operations-flow-spine{top:130px;height:78px}
 .operations-flow-paper{width:77%;bottom:40px;padding:11px 13px}
 .operations-flow-paper strong{font-size:23px;margin:10px 0}
 .operations-flow-paper p{font-size:11px;margin-bottom:10px}
 .operations-flow-foot{font-size:7px}
}
@media(prefers-reduced-motion:reduce){.case-art *{transition:none!important;animation:none!important}}