/* Keep the supplied illustration's complete composition, without cover zoom. */
.calc-container{width:min(1240px,calc(100% - 48px));grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);column-gap:18px}
.calc-hero-graphic{min-height:0!important;height:auto;aspect-ratio:var(--art-ratio,3 / 2);background-size:contain;background-position:center top;background-color:transparent;border-radius:0;padding:0;align-self:start;overflow:hidden}
.calc-hero-graphic.original-artwork{background-size:var(--art-size);background-position:right top}
.calc-hero-graphic::before,.calc-hero-graphic .hero-graphic-card{display:none}
.calc-hero-h1{font-size:clamp(28px,2.6vw,38px)}
.calc-bottom-banner{position:relative;overflow:hidden;min-height:120px;padding:22px 26px}
.calc-bottom-banner .banner-content{position:relative;z-index:1;max-width:70%}.calc-bottom-banner h3{font-size:22px}
#banner-original-art{position:absolute;right:0;bottom:0;width:38%;height:100%;background-position:right bottom;background-repeat:no-repeat;background-size:250% auto;pointer-events:none;mask-image:linear-gradient(to right,transparent,#000 18%)}
@media(max-width:800px){.calc-container{width:calc(100% - 28px)}.calc-hero-graphic{width:min(100%,500px);margin:auto;flex:none}.calc-bottom-banner .banner-content{max-width:100%}#banner-original-art{opacity:.22;width:55%}.calc-hero-grid{gap:16px}}

.calc-hero-graphic{width:100%;max-width:560px;justify-self:end}
@media(max-width:520px){.calc-hero-h1 .hl{display:block}.calc-hero-h1{white-space:normal}.calc-bottom-banner{min-height:0}}

/* Feather the scene into the shared canvas without tinting its central artwork. */
.calc-hero-graphic{
 -webkit-mask-image:linear-gradient(to right,transparent,#000 7%,#000 95%,transparent),linear-gradient(to bottom,transparent,#000 6%,#000 78%,transparent 99%);
 mask-image:linear-gradient(to right,transparent,#000 7%,#000 95%,transparent),linear-gradient(to bottom,transparent,#000 6%,#000 78%,transparent 99%);
 -webkit-mask-composite:source-in;
 mask-composite:intersect;
}