/* Portrait variant: same brand, typography and responsive layout. */
.hero-portrait{isolation:isolate;min-width:0;height:auto;min-height:530px;padding:25px 20px 105px;transform:none}
.hero-portrait .orbital{z-index:-1;max-width:100%;aspect-ratio:1;height:auto}
.hero-portrait .cross-one{top:10px;left:20px}
.hero-portrait .cross-two{right:8px;bottom:55px}
.portrait-frame{position:relative;max-width:100%;width:350px;aspect-ratio:350/400;border-radius:18px;overflow:hidden;border:1px solid #69503b;box-shadow:0 25px 65px #0005,0 0 65px #fe6f270c;background:#bfc0bc}
.portrait-photo{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.portrait-signature{position:absolute;bottom:16px;right:16px;width:50px;height:50px;display:grid;place-items:center;background:#171717ec;border:1px solid #68432b;border-radius:10px}
.portrait-signature img{filter:invert(52%) sepia(96%) saturate(2252%) hue-rotate(342deg) brightness(104%) contrast(99%)}
.hero-portrait .portrait-stack{z-index:2;top:8px;right:0;max-width:100%;padding:12px 17px;font-size:.875rem;line-height:1.5;transform:rotate(4deg);background:#201a15;border-color:#63422b;box-shadow:0 12px 30px #0005}
.hero-portrait .portrait-code{z-index:2;left:0;bottom:5px;max-width:calc(100% - 12px);padding:19px 23px;font-size:.875rem;line-height:1.95;background:#191816f5;border-color:#58402d;box-shadow:0 20px 45px #0006;transform:rotate(-4deg)}
.portrait-code .code-comment{color:#b0a092;font-size:.75rem}
@media(max-width:950px) and (min-width:721px){.hero-portrait{padding-inline:8px;min-height:490px}.portrait-frame{width:310px}.hero-portrait .portrait-code{padding:16px;font-size:.8125rem}.hero-portrait .portrait-stack{padding:10px 12px;font-size:.8125rem}}
@media(max-width:720px){.hero-portrait{width:min(100%,390px);min-height:0;padding:30px 12px 15px;margin-block:5px 10px;transform:none;row-gap:0}.portrait-frame{width:320px}.hero-portrait .orbit-one{width:90%}.hero-portrait .orbit-two{width:100%}.hero-portrait .cross-one{left:5px;top:0}.hero-portrait .cross-two{right:0;bottom:48px}.hero-portrait .portrait-stack{top:8px;right:4px;padding:10px 12px;font-size:.8125rem;transform:rotate(3deg)}.hero-portrait .portrait-code{position:relative;left:auto;bottom:auto;justify-self:start;margin-top:-35px;max-width:calc(100% - 5px);padding:17px;font-size:.8125rem;transform:rotate(-2deg)}}
