/* Real CALMA image, inside a laptop made of independent aluminium planes. */
.hero-project.mac-project{padding-top:0;perspective:none;transform:none}
.hero-project.mac-project figure,.hero-project.mac-project:is(:hover,:focus-visible) figure{background:transparent;border:0;box-shadow:none;transform:none!important;transition:none;transform-style:flat}
.hero-project.mac-project figure::after{display:none}
.mac-project .project-strip,.hero-project.mac-project figcaption{background:transparent;padding-inline:0;color:#b8bfbd}
.mac-project .project-strip{padding-top:0;padding-bottom:12px}
.hero-project.mac-project figcaption{border-top:1px solid #414749;padding-block:16px;align-items:center}
.mac-stage{position:relative;width:100%;aspect-ratio:1.4;perspective:1450px;perspective-origin:50% 46%;isolation:isolate}
.mac-shadow{position:absolute;left:8%;right:9%;bottom:3%;height:11%;border-radius:50%;background:#000;filter:blur(14px);opacity:.8;transform:scaleY(.55);pointer-events:none}
.mac-orbit{position:absolute;left:14%;top:5%;width:76%;transform-style:preserve-3d;transform:translate3d(0,var(--mac-lift,0px),0) rotateX(calc(var(--mac-rx,-16deg) + var(--mac-scroll-tilt,0deg))) rotateY(var(--mac-ry,-16deg));transform-origin:50% 100%}
.mac-lid{position:relative;transform-style:preserve-3d;transform:rotateX(var(--mac-lid-angle,10deg));transform-origin:50% 100%}
.mac-display{position:relative;aspect-ratio:1.68;transform-style:preserve-3d}
.mac-front,.mac-back{position:absolute;inset:0;border-radius:9px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.mac-front{background:#080b0d;transform:translateZ(3px);box-shadow:0 0 0 1px #788891,0 0 0 2px #36434b,0 1px 0 2px #aebdc0;overflow:hidden}
.mac-back{transform:translateZ(-3px) rotateY(180deg);background:linear-gradient(112deg,#89999f 0%,#a9b5b8 17%,#77888f 47%,#536771 78%,#a4b1b5 100%);box-shadow:0 0 0 1px #bcc8c8 inset}
.mac-back::after{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(112deg,transparent 18%,rgba(229,239,235,.09) 43%,transparent 62%)}
.mac-edge{position:absolute;backface-visibility:hidden;-webkit-backface-visibility:hidden;pointer-events:none;background:linear-gradient(90deg,#d2dcda,#73868e 38%,#30434e 74%,#a6b7bc);border:1px solid rgba(212,225,225,.16)}
.mac-edge-top,.mac-edge-bottom{left:0;width:100%;height:6px}
.mac-edge-top{top:0;transform:translateY(-50%) rotateX(90deg)}
.mac-edge-bottom{bottom:0;transform:translateY(50%) rotateX(-90deg);background:#354954}
.mac-edge-left,.mac-edge-right{top:0;height:100%;width:6px}
.mac-edge-left{left:0;transform:translateX(-50%) rotateY(-90deg);background:linear-gradient(90deg,#293d48,#aebfc3)}
.mac-edge-right{right:0;transform:translateX(50%) rotateY(90deg);background:linear-gradient(90deg,#d7e1df,#657e8b 42%,#203641)}
.mac-camera{position:absolute;left:calc(50% - 1.5px);top:1.1%;width:3px;height:3px;border-radius:50%;background:#14232c;box-shadow:0 0 0 1px #030607;z-index:2}
.mac-camera::after{content:'';position:absolute;top:1px;left:1px;width:1px;height:1px;background:#466979;border-radius:50%}
.mac-screen{position:absolute;top:3%;left:1.8%;right:1.8%;aspect-ratio:1265/712;overflow:hidden;background:#eee5cd;box-shadow:0 0 0 1px #020303;transform:translateZ(.1px)}
.hero-project.mac-project .mac-screen img{width:100%;height:100%;aspect-ratio:1265/712;object-fit:contain;object-position:center;transform:none}
.mac-glass{position:absolute;inset:-15% -30%;pointer-events:none;background:linear-gradient(118deg,rgba(232,243,241,.16),rgba(232,243,241,.015) 26%,transparent 45%,rgba(240,246,243,.025) 76%,rgba(240,246,243,.07));opacity:.62;transform:translateX(var(--glass-x,0%));transition:opacity 600ms}
.mac-project:is(:hover,:focus-visible) .mac-glass{opacity:.95}
.mac-chin{position:absolute;left:0;right:0;bottom:0;height:5.8%;background:linear-gradient(180deg,#11191e,#080c0f 72%,#263943);border-top:1px solid #070c0f}
.mac-chin::after{content:'';position:absolute;left:20%;right:20%;bottom:0;height:2px;background:linear-gradient(90deg,#2d414c,#647f8b 50%,#2d414c)}
/* The keyboard and palm rest share a horizontal plane, hinged to the lid. */
.mac-deck{position:absolute;left:0;top:100%;width:100%;aspect-ratio:1.88;transform-style:preserve-3d;transform:rotateX(90deg);transform-origin:50% 0}
.mac-deck-top,.mac-deck-bottom{position:absolute;inset:0;border-radius:8px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.mac-deck-top{transform:translateZ(4px);background:linear-gradient(116deg,#a0aeb2,#80949f 43%,#5e7785 72%,#99adb5);box-shadow:0 0 0 1px #c3d1d0 inset,0 3px 0 rgba(16,36,49,.6) inset;overflow:hidden}
.mac-deck-bottom{transform:translateZ(-4px) rotateX(180deg);background:linear-gradient(110deg,#435d6c,#6e8793 42%,#2a4555);box-shadow:0 0 0 1px #95abb4 inset}
.mac-deck-top::before,.mac-deck-top::after{content:'';position:absolute;top:10%;height:43%;width:2.6%;background:repeating-linear-gradient(0deg,rgba(9,24,34,.65) 0 1px,transparent 1px 3px);opacity:.65}
.mac-deck-top::before{left:3.7%}.mac-deck-top::after{right:3.7%}
.mac-keyboard{position:absolute;left:9%;right:9%;top:8%;height:47%;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(5,minmax(0,1fr));gap:3px;padding:3px;border-radius:4px;background:#263b47;box-shadow:0 0 0 1px rgba(21,39,50,.8),0 1px 0 rgba(206,224,224,.24) inset}
.mac-keyboard span{display:block;min-width:0;min-height:0;border-radius:2px;background:linear-gradient(180deg,#283138,#101b23 78%);box-shadow:0 1px 0 #64717a inset,0 0 0 1px #07121a,0 1px 1px #07121a}
.mac-keyboard span:nth-child(53){grid-column:5 / 9}
.mac-keyboard span:nth-child(n+58){display:none}
.mac-trackpad{position:absolute;left:34%;width:32%;top:64%;height:26%;border:1px solid #435f6e;border-radius:4px;background:linear-gradient(116deg,rgba(194,213,213,.14),rgba(45,71,86,.1));box-shadow:0 1px 0 rgba(211,230,227,.17) inset,0 1px 0 rgba(212,231,229,.23)}
.mac-deck-edge{position:absolute;pointer-events:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:linear-gradient(90deg,#9fb5be,#5d7c8f 48%,#263f50);box-shadow:0 1px 0 rgba(209,227,225,.38) inset}
.mac-deck-edge-front{left:0;bottom:0;width:100%;height:8px;transform:translateY(50%) rotateX(-90deg);border-radius:0 0 7px 7px}
.mac-deck-edge-left,.mac-deck-edge-right{top:0;height:100%;width:8px}
.mac-deck-edge-left{left:0;transform:translateX(-50%) rotateY(-90deg);background:linear-gradient(90deg,#203a4b,#8ca9b6)}
.mac-deck-edge-right{right:0;transform:translateX(50%) rotateY(90deg);background:linear-gradient(90deg,#bbcece,#526f80)}
.mac-deck-edge-left::after,.mac-deck-edge-right::after{content:'';position:absolute;top:23%;left:2px;width:3px;height:12%;border-radius:1px;background:#10232f;box-shadow:0 15px 0 #10232f}
.mac-deck-notch{position:absolute;left:46%;bottom:-1px;width:8%;height:3px;border-radius:0 0 50% 50%;background:#2c4655;transform:translateZ(4.3px);box-shadow:0 -1px 0 rgba(16,32,42,.6)}
.mac-project:focus-visible{outline-offset:12px}
@media(min-width:1600px){.mac-stage{perspective:1800px}}
@media(max-width:760px){.mac-project .project-strip{padding-bottom:16px}.mac-stage{max-width:580px;margin-inline:auto;aspect-ratio:1.22;perspective:1000px;perspective-origin:50% 43%}.mac-orbit{width:80%;left:14%;top:9%}.mac-front,.mac-back{border-radius:6px}.mac-camera{width:2px;height:2px;left:calc(50% - 1px);top:1.15%}.mac-camera::after{display:none}.mac-shadow{bottom:6%;filter:blur(10px)}.hero-project.mac-project figcaption{padding-block:16px}.mac-keyboard{gap:2px;padding:2px}.mac-keyboard span{border-radius:1px}.mac-glass{opacity:.55}}
@media(prefers-reduced-motion:reduce){.mac-orbit{transform:rotateX(-16deg) rotateY(-16deg)}.mac-lid{transform:rotateX(10deg)}.mac-glass{transition:none}}
@media(forced-colors:active){.mac-stage{perspective:none;aspect-ratio:1265/712}.mac-orbit{position:static;width:100%;transform:none}.mac-lid{transform:none;transform-style:flat}.mac-display{aspect-ratio:1265/712;transform-style:flat}.mac-front{transform:none;border:1px solid CanvasText;border-radius:0;background:Canvas;box-shadow:none}.mac-screen{inset:0;aspect-ratio:1265/712;box-shadow:none;transform:none}.mac-back,.mac-edge,.mac-camera,.mac-chin,.mac-deck,.mac-shadow,.mac-glass{display:none}}
@media print{.mac-stage{perspective:none;aspect-ratio:1265/712}.mac-orbit{position:static;width:100%;transform:none}.mac-lid{transform:none;transform-style:flat}.mac-display{aspect-ratio:1265/712;transform-style:flat}.mac-front{transform:none;border:0;border-radius:0;background:transparent;box-shadow:none}.mac-screen{inset:0;aspect-ratio:1265/712;box-shadow:none;transform:none}.mac-back,.mac-edge,.mac-camera,.mac-chin,.mac-deck,.mac-shadow,.mac-glass{display:none}}
