.banner-preview-page{min-height:100vh;margin:0;padding:36px 18px;background:#0f0f0f;color:#fff;font-family:'Hind',sans-serif}.banner-preview-backdrop{position:fixed;inset:0;background:linear-gradient(rgba(0,0,0,.78),rgba(0,0,0,.9)),url('../images/banner.jpg') center/cover;filter:saturate(.5)}.banner-config{position:relative;z-index:1;width:min(1180px,100%);margin:0 auto;background:#1b1b1b;box-shadow:0 25px 90px rgba(0,0,0,.65)}.banner-config__header{display:flex;justify-content:space-between;gap:30px;padding:38px 46px 32px;border-bottom:1px solid rgba(255,255,255,.13)}.banner-config__header h1{margin:2px 0 6px;color:#fff;font:700 clamp(32px,4vw,52px)/1.05 'Poppins',sans-serif}.banner-config__header>div>p:last-child{margin:0;color:#999}.banner-config__eyebrow{margin:0;color:#b3d61e;font:600 11px/1.4 'Poppins',sans-serif;letter-spacing:1.7px;text-transform:uppercase}.banner-config__close{width:44px;height:44px;display:grid;place-items:center;flex:0 0 auto;border:1px solid rgba(255,255,255,.22);border-radius:50%;color:#fff;text-decoration:none}.banner-config__close:hover{background:#b3d61e;color:#1b1b1b}.banner-config__layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,.75fr);align-items:start}.banner-config__controls{padding:4px 46px 40px}.banner-step{margin:0;padding:26px 0;border:0;border-bottom:1px solid rgba(255,255,255,.13)}.banner-step legend{float:none;width:100%;margin:0 0 17px;color:#fff;font:600 18px/1.3 'Poppins',sans-serif}.banner-step legend span{display:inline-block;width:36px;color:#b3d61e;font-size:11px}.banner-dimensions{display:flex;align-items:flex-end;gap:14px}.banner-dimensions label{flex:1;color:#999;font-size:13px}.banner-dimensions label span{display:flex;align-items:center;gap:9px;margin-top:6px;color:#fff}.banner-dimensions input{width:100%;height:48px;padding:0 13px;border:1px solid rgba(255,255,255,.22);border-radius:0;outline:0;background:#222;color:#fff;font:600 15px 'Poppins',sans-serif}.banner-dimensions input:focus{border-color:#b3d61e}.banner-dimensions>i{margin-bottom:11px;color:#b3d61e;font-style:normal;font-size:22px}.banner-presets{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.banner-presets button{padding:6px 10px;border:1px solid rgba(255,255,255,.16);background:transparent;color:#888;font-size:11px;cursor:pointer}.banner-presets button:hover,.banner-presets button.is-active{border-color:#b3d61e;color:#b3d61e}.banner-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.banner-options--single{grid-template-columns:1fr}.banner-options--three{grid-template-columns:repeat(3,minmax(0,1fr))}.banner-options label{cursor:pointer}.banner-options input{position:absolute;opacity:0}.banner-options label>span{min-height:68px;display:flex;flex-direction:column;justify-content:center;gap:3px;padding:13px 15px;border:1px solid rgba(255,255,255,.17);transition:.2s}.banner-options input:checked+span{border-color:#b3d61e;background:rgba(179,214,30,.08)}.banner-options input:focus-visible+span{outline:2px solid #b3d61e;outline-offset:2px}.banner-options b{color:#fff;font:600 13px 'Poppins',sans-serif}.banner-options small{color:#777;font-size:12px;line-height:1.35}.banner-options em{margin-top:3px;color:#b3d61e;font-style:normal;font-size:12px}.banner-quantity{width:155px;display:grid;grid-template-columns:42px 1fr 42px;border:1px solid rgba(255,255,255,.2)}.banner-quantity button,.banner-quantity input{height:45px;border:0;background:transparent;color:#fff;text-align:center}.banner-quantity button{cursor:pointer}.banner-quantity button:hover{color:#b3d61e}.banner-quantity input{width:100%;border-left:1px solid rgba(255,255,255,.15);border-right:1px solid rgba(255,255,255,.15);font-weight:700}.banner-config__summary{position:sticky;top:20px;min-height:100%;padding:40px 36px;background:#f5f5f1;color:#1b1b1b}.banner-visual{height:245px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;margin:18px 0 24px;overflow:hidden;background:#deded8;background-image:linear-gradient(45deg,#d5d5cf 25%,transparent 25%),linear-gradient(-45deg,#d5d5cf 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d5d5cf 75%),linear-gradient(-45deg,transparent 75%,#d5d5cf 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}.banner-visual__sheet{position:relative;width:210px;height:105px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#b3d61e;box-shadow:0 12px 25px rgba(0,0,0,.22);transition:width .2s,height .2s}.banner-visual__sheet img{width:80px;max-height:26px;object-fit:contain;margin-bottom:5px}.banner-visual__sheet>span{font:800 15px 'Poppins',sans-serif;letter-spacing:.5px}.banner-visual small{color:#555}.eyelet{position:absolute;width:7px;height:7px;border:2px solid #999;border-radius:50%;background:#eee}.eyelet--tl{top:7px;left:7px}.eyelet--tr{top:7px;right:7px}.eyelet--bl{bottom:7px;left:7px}.eyelet--br{right:7px;bottom:7px}.banner-summary-list{margin:0}.banner-summary-list div{display:flex;justify-content:space-between;gap:18px;padding:9px 0;border-bottom:1px solid #ddd}.banner-summary-list dt{color:#777;font-weight:400}.banner-summary-list dd{margin:0;font-weight:600;text-align:right}.banner-price{display:grid;grid-template-columns:1fr auto;align-items:end;margin-top:24px}.banner-price span{font:600 12px 'Poppins',sans-serif;text-transform:uppercase}.banner-price strong{color:#1b1b1b;font:700 31px 'Poppins',sans-serif;letter-spacing:-1px}.banner-price small{grid-column:2;color:#777;text-align:right}.banner-price-note{margin:16px 0;color:#777;font-size:11px;line-height:1.5}.banner-config__submit{width:100%;min-height:50px;border:0}.banner-config__submit i{margin-left:8px}@media(max-width:900px){.banner-preview-page{padding:0}.banner-config__layout{grid-template-columns:1fr}.banner-config__summary{position:static}.banner-config__header,.banner-config__controls{padding-left:24px;padding-right:24px}}@media(max-width:560px){.banner-config__header{padding-top:28px}.banner-config__header h1{font-size:34px}.banner-dimensions{gap:8px}.banner-options,.banner-options--three{grid-template-columns:1fr}.banner-config__summary{padding:32px 20px}.banner-presets button{flex:1}}

.banner-price{display:flex;flex-direction:column;align-items:stretch;margin-top:24px;padding:20px;background:#eeeeea}.banner-price span{color:#666;font:600 12px 'Hind',sans-serif;letter-spacing:.5px;text-transform:uppercase}.banner-price strong{margin:5px 0 2px;color:#1b1b1b;font:700 34px/1.1 'Poppins',sans-serif;letter-spacing:normal}.banner-price small{color:#666;text-align:left}
.banner-price .prepress-fee{display:block;margin-top:10px;padding:10px 12px;border-left:3px solid #b3d61e;background:rgba(179,214,30,.22);color:#1b1b1b;text-align:left;font-size:11px;font-weight:700;line-height:1.45}

/* Consistent quantity stepper for banner, board and roll-up configurators. */
.banner-quantity{grid-template-columns:42px minmax(0,1fr) 42px}
.banner-quantity button,.banner-quantity input{box-sizing:border-box;min-width:0;margin:0;padding:0;border-radius:0}
.banner-quantity button{display:grid;place-items:center}
.banner-quantity button i{display:block;line-height:1}
.banner-quantity button:focus-visible{color:#b3d61e;outline:0}
.banner-quantity input{appearance:textfield;-moz-appearance:textfield}
.banner-quantity input::-webkit-inner-spin-button,.banner-quantity input::-webkit-outer-spin-button{margin:0;appearance:none;-webkit-appearance:none}