:root{--ink:#282223;--text:#372e2a;--muted:#75706d;--lime:#f1e5d0;--line:#e8e5e4;--soft:#f6f5f4;--font:'DM Sans',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:#ffffff;color:var(--text);font:16px/1.6 var(--font)}h1,h2,h3,h4,p,figure{margin:0}h1,h2,h3,h4{color:var(--ink);line-height:1.2}h2{font-size:34px;letter-spacing:-1px;font-weight:700}h3{font-size:19px;font-weight:650}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}img{display:block;max-width:100%}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #b0333e;outline-offset:4px}input:focus,select:focus,textarea:focus{outline:2px solid #ca4852;outline-offset:2px}[hidden]{display:none!important}.page-width{width:calc(100% - 64px);max-width:1280px;margin-inline:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-80px;left:20px;padding:12px 20px;background:var(--ink);color:white;z-index:100}.skip-link:focus{top:12px}
.announcement{background:var(--ink);color:#ebe7e6;font-size:12px;padding:9px 0;overflow:hidden;cursor:default}.announcement-track{display:flex;width:max-content;align-items:center;gap:30px;animation:ann-ticker 40s linear infinite}.announcement:hover .announcement-track{animation-play-state:paused}.ann-sep{color:var(--lime);font-size:9px;opacity:.75;flex:none}.announcement a{color:#f4e9d7}@keyframes ann-ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}.header{position:sticky;top:0;z-index:10;background:#fffffff5;backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.header-inner{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand-lockup{display:inline-flex;align-items:center;gap:10px;flex:none}.brand-lockup>img{width:42px;height:42px;object-fit:contain;border-radius:50%;background:#ffffff}.brand-type{display:flex;flex-direction:column}.brand-type strong{font-size:28px;line-height:1.05;letter-spacing:-1.1px;color:var(--ink);font-weight:800}.brand-type strong>span{color:#9b2d36}.brand-type small{font-size:12px;line-height:1.4;color:var(--muted);margin-top:5px}.main-nav{display:flex;gap:30px;font-size:14px;font-weight:500}.main-nav a{padding:12px 0}.main-nav a:hover{color:#85272e}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:12px 19px;border:1px solid transparent;border-radius:7px;font-size:14px;font-weight:600;line-height:1.4;transition:background .18s,border-color .18s}.button-dark{background:var(--ink);color:white}.button-dark:hover{background:#3e3637}.button-outline{color:var(--ink);border-color:#c8c3c1;background:transparent}.button-outline:hover{background:#f2f0ef;border-color:#aea6a2}.button-lime{background:var(--lime);color:var(--ink)}.button-lime:hover{background:#e9d5b3}.button-whatsapp{background:#1b7548;color:#fff}.button-whatsapp:hover{background:#135c37}.header-quote{white-space:nowrap}.quote-count{background:#433c3d;border-radius:4px;font-size:12px;padding:2px 6px}.eyebrow{display:block;font-size:12px;line-height:1.6;font-weight:600;letter-spacing:1.1px;color:#9d2e37;margin-bottom:14px}.eyebrow.muted{color:#85807e}.lime-dot{color:#b73540}.full-width{width:100%}.icon{width:20px;height:20px;flex:none}
.hero{display:grid;grid-template-columns:1fr 1.15fr;align-items:center;gap:48px;padding:45px 0 34px}.hero-copy h1,.hero-copy .hero-turn{font-size:clamp(46px,4.9vw,68px);line-height:1.06;letter-spacing:-2.7px;font-weight:750;margin-bottom:22px}.hero-copy h1>span{position:relative;z-index:0;white-space:nowrap}.hero-copy h1>span:after{content:'';position:absolute;bottom:4px;left:0;right:0;height:9px;background:var(--lime);z-index:-1}.hero-copy>p{color:var(--muted);font-size:17px;line-height:1.8;max-width:390px;margin-bottom:25px}.hero-actions{display:flex;flex-wrap:wrap;gap:11px}.hero-points{display:flex;flex-wrap:wrap;gap:15px;font-size:13px;color:#817975;margin-top:22px}.hero-points span+span:before{content:'·';margin-right:15px;color:#aaa09b}.hero-media{position:relative;min-width:0;border-radius:16px;overflow:hidden;background:#f1f3f4;aspect-ratio:1.35}.hero-media>picture>img{width:100%;height:100%;object-fit:cover;object-position:center}.hero-media figcaption{position:absolute;bottom:14px;left:15px;font-size:12px;line-height:1.4;padding:5px 9px;border-radius:4px;background:#fffffff0;color:#665f5c;max-width:calc(100% - 30px)}.surface-strip{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:20px 0;border-block:1px solid var(--line);color:#68605d;font-size:13px;font-weight:500}.surface-strip span{display:flex;align-items:center;gap:9px}.surface-strip span:before{content:'✓';display:flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:#edebe9;color:#992d36;font-size:11px;flex:none}
.catalog{padding:46px 0 42px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:26px}.section-heading .eyebrow{margin-bottom:10px}.section-heading p{font-size:16px;color:var(--muted);margin-top:12px}.search{display:flex;align-items:center;gap:11px;width:280px;background:white;border:1px solid var(--line);border-radius:8px;padding:0 14px;flex:none}.search svg{height:18px;width:18px;color:#908885;flex:none}.search input{width:100%;min-width:0;border:0;background:transparent;color:var(--ink);font-size:14px;padding:13px 0;outline:none}.search:focus-within{border-color:#c33944;box-shadow:0 0 0 2px #c9c3bf}.category-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:0}.category-tab{border:1px solid #e3dfde;border-radius:6px;background:#ffffff;color:#766e6a;padding:9px 14px;min-height:43px;font-size:14px;line-height:1.5;white-space:nowrap}.category-tab:hover{background:#f4f2f1}.category-tab.active{background:var(--ink);border-color:var(--ink);color:#ffffff}.catalog-meta{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:23px 0 18px;font-size:13px;color:#837e7c}.sort-label{display:flex;align-items:center;gap:7px;flex:none;font-size:13px}.sort-label select{border:0;background:transparent;padding:5px;color:#635955;font-size:14px;max-width:145px}.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 20px}.product-card{min-width:0;background:#ffffff;border:1px solid var(--line);border-radius:11px;overflow:hidden;transition:border-color .18s,box-shadow .18s}.product-card:hover{border-color:#b7ada9;box-shadow:0 6px 18px #2822230b}.product-photo{display:block;position:relative;border:0;padding:0;width:100%;aspect-ratio:1;background-color:#f1f3f4;background-image:url('assets/varied-products.webp');background-repeat:no-repeat;background-size:400% 300%;overflow:hidden}.photo-action{position:absolute;bottom:12px;left:12px;background:#ffffffed;border-radius:4px;color:#423b3b;font-size:12px;padding:4px 8px;opacity:0;transition:opacity .18s;pointer-events:none}.product-photo:hover .photo-action,.product-photo:focus-visible .photo-action{opacity:1}.product-info{padding:16px}.product-category{display:block;font-size:12px;color:#8c8582;line-height:1.5;letter-spacing:.25px;margin-bottom:6px}.product-title{display:block;border:0;background:transparent;padding:0;text-align:left;font-size:17px;line-height:1.35;font-weight:650;letter-spacing:-.3px;color:var(--ink);min-height:46px}.product-title:hover{color:#972c35}.product-subtitle{font-size:14px;color:#847c79;line-height:1.6;margin-top:7px;min-height:45px}.card-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:15px;border-top:1px solid var(--line);padding-top:12px}.custom-text{font-size:12px;color:#8d837f}.add-quote{display:flex;align-items:center;gap:8px;padding:0;border:0;background:transparent;color:var(--ink);font-size:14px;line-height:1.4;font-weight:600;min-height:38px;white-space:nowrap}.add-quote>span{display:flex;align-items:center;justify-content:center;height:24px;width:24px;background:#edebe9;border-radius:50%;font-size:19px;font-weight:400;color:#a9313b}.add-quote.selected{color:#8e2932}.preview-note{font-size:13px;color:#918986;margin-top:23px;line-height:1.7}.empty-results{text-align:center;padding:45px 15px;border:1px dashed #d2cac6;border-radius:10px}.empty-results p{color:var(--muted);margin:12px 0 22px}
.photo-bat{background-position:0% 0%}.photo-helmet{background-position:33.333333% 0%}.photo-pads{background-position:66.666667% 0%}.photo-bag{background-position:100% 0%}.photo-bottle{background-position:33.333333% 50%}.photo-patch{background-position:66.666667% 50%}.photo-trophy{background-position:100% 50%}.photo-medal{background-position:0% 100%}.photo-magnet{background-position:33.333333% 100%}.photo-keychain{background-position:66.666667% 100%}.photo-box{background-position:100% 100%}.photo-jersey{background-image:url('assets/products.webp')!important;background-size:300% 200%!important;background-position:50% 0%}
.custom-banner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px;background:#eeecea;border-radius:13px;padding:36px 40px;margin-bottom:44px}.custom-banner h2{font-size:38px;line-height:1.1;letter-spacing:-1.2px}.custom-banner .eyebrow{font-size:12px;color:#8e786e;margin-bottom:14px}.custom-banner p{color:#7f726c;font-size:16px;line-height:1.8;max-width:425px;margin-bottom:20px}.how-section{padding:18px 0 43px}.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px}.step{border-top:1px solid var(--line);padding:23px 0 0}.step>span{font-size:13px;color:#8b766d;display:block;margin-bottom:12px}.step h3{font-size:18px;margin-bottom:12px}.step p{color:var(--muted);font-size:16px;line-height:1.75;max-width:345px}.reviews-section{padding:30px 0 42px;border-top:1px solid var(--line)}.review-media-empty{display:flex;align-items:center;justify-content:space-between;gap:30px;background:var(--soft);border-radius:10px;padding:25px 28px}.review-media-empty h3{font-size:18px}.review-media-empty p{font-size:15px;line-height:1.7;color:var(--muted);margin-top:8px;max-width:600px}.review-media-empty .button{flex:none}.review-media-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.review-card{border:1px solid var(--line);border-radius:10px;overflow:hidden}.review-photo-button{padding:0;border:0;background:#f1f3f4;display:block;width:100%;cursor:zoom-in}.review-card img,.review-card video{width:100%;height:340px;object-fit:contain;background:#f1f3f4;display:block}.review-card-body{padding:17px}.review-card h3{font-size:18px;margin-bottom:8px}.review-card p{font-size:14px;color:var(--muted);line-height:1.7}.review-card .text-button{margin-top:12px}.review-load-error{padding:25px;color:var(--muted)}.faqs{padding:30px 0 44px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1.65fr;gap:40px}.faqs h2{font-size:32px;max-width:260px}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;padding:17px 0;font-size:16px;line-height:1.6;color:#5a4f4a}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary>span{font-size:20px;font-weight:400;color:#978a84}.faq-list details[open] summary>span{transform:rotate(45deg)}.faq-list p{font-size:16px;line-height:1.8;color:var(--muted);padding:0 28px 20px 0}
footer{background:#f5f4f4;border-top:1px solid var(--line);padding:25px 0}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:25px;flex-wrap:wrap;font-size:13px;color:#857b77}.footer-inner .brand-type strong{font-size:25px}.footer-inner .brand-type small{font-size:12px}.footer-inner>p{font-size:13px}.footer-inner>a:not(.brand-lockup){display:inline-flex;align-items:center;gap:6px;font-size:14px;color:#6c5b53}.footer-inner>span{font-size:12px}
dialog{border:0;padding:0;border-radius:14px;color:var(--text);background:#ffffff;max-width:calc(100vw - 32px);max-height:90dvh;overflow:auto;box-shadow:0 24px 80px #1c171833}dialog::backdrop{background:#1d18195e;backdrop-filter:blur(4px)}.close-button{display:flex;align-items:center;justify-content:center;position:absolute;right:19px;top:18px;width:40px;height:40px;padding:0;border:1px solid #e0dddb;border-radius:50%;background:#ffffff;color:#6f635e;font-size:25px;font-weight:400;line-height:1;z-index:1}.close-button:hover{background:#f3f1f0}.product-dialog{width:900px}.product-dialog-layout{display:grid;grid-template-columns:1fr 1.08fr;align-items:center}.detail-image{width:calc(100% - 36px);aspect-ratio:1;margin:18px;border-radius:10px;background-color:#f1f3f4;background-image:url('assets/varied-products.webp');background-repeat:no-repeat;background-size:400% 300%}.detail-content{position:relative;padding:32px 30px}.detail-content>.eyebrow{padding-right:45px;margin-bottom:13px}.detail-content h2{font-size:29px;line-height:1.2;letter-spacing:-.6px;max-width:340px;margin-bottom:16px}.detail-content>p{font-size:16px;line-height:1.75;color:var(--muted);margin-bottom:21px}.detail-specs{border-block:1px solid var(--line);padding:10px 0;margin-bottom:20px}.spec-row{display:flex;justify-content:space-between;gap:20px;font-size:13px;padding:9px 0;color:#8c8480}.spec-row strong{color:#6b605b;font-weight:500;text-align:right}.detail-quantity{display:flex;justify-content:space-between;align-items:center;font-size:14px;margin-bottom:18px}.detail-quantity input{width:95px;border:1px solid #dcd4d1;border-radius:6px;padding:9px 12px;font-size:16px;color:var(--ink)}.detail-content .detail-footnote{font-size:12px;line-height:1.7;text-align:center;margin:13px 0 0}
.quote-dialog{width:990px}.quote-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:25px;position:relative;padding:27px 30px 23px;border-bottom:1px solid var(--line)}.quote-heading h2{font-size:29px;margin-bottom:9px;padding-right:45px}.quote-heading .eyebrow{margin-bottom:8px}.quote-heading p{font-size:15px;color:var(--muted)}.quote-dialog-body{display:grid;grid-template-columns:300px 1fr}.quote-selection{background:#f5f4f3;padding:26px 23px;border-right:1px solid var(--line)}.selection-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.selection-heading h3{font-size:17px}.selection-heading>span{font-size:12px;color:#948883}.quote-items{max-height:400px;overflow:auto}#quote-items{max-height:400px;overflow:auto}.quote-item{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid #e1dfdd}.quote-thumb{height:56px;width:56px;aspect-ratio:1;flex:none;border-radius:6px;background-image:url('assets/varied-products.webp');background-repeat:no-repeat;background-size:400% 300%;background-color:#f1f3f4}.quote-item-content{flex:1;min-width:0}.quote-item h4{font-size:13px;font-weight:600;line-height:1.45;margin-bottom:8px}.remove-item{border:0;background:transparent;font-size:23px;line-height:1;width:30px;height:36px;flex:none;color:#9a8b85}.quantity-controls{display:inline-flex;align-items:center;height:33px;border:1px solid #d6d2cf;border-radius:5px;background:#ffffff;overflow:hidden}.quantity-controls button{height:32px;width:30px;border:0;background:#f5f4f3;color:#7f6e66;font-size:19px}.quantity-controls button:disabled{color:#c2bab7;cursor:default}.quantity-controls input{width:58px;max-width:80px;border:0;background:#ffffff;text-align:center;font-size:14px;padding:3px 0;color:#494041;appearance:textfield}.quantity-controls input::-webkit-inner-spin-button{appearance:none}.quote-pricing-note{font-size:12px;color:#938883;line-height:1.8;margin-top:22px}.selection-empty{padding:15px 0}.selection-empty h4{font-size:16px;line-height:1.4;margin-bottom:13px}.selection-empty p{font-size:14px;line-height:1.7;color:#938681;margin-bottom:13px}.text-button{font:600 14px/1.5 var(--font);color:#952b34;background:transparent;border:0;padding:0;text-align:left;min-height:32px;cursor:pointer}.text-button:hover{text-decoration:underline;text-underline-offset:4px}.quote-form-panel{padding:27px 30px 30px}.quote-form-panel h3{font-size:20px;margin-bottom:22px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:19px}.quote-form-panel label{display:flex;flex-direction:column;gap:7px;font-size:13px;color:#716661;font-weight:500}.quote-form-panel label>span{color:#a99993}.quote-form-panel input,.quote-form-panel select,.quote-form-panel textarea{width:100%;min-width:0;border:1px solid #dcd9d7;border-radius:6px;background:white;padding:11px 12px;color:#7b242b;font-size:16px;font-weight:400;line-height:1.5}.quote-form-panel input::placeholder,.quote-form-panel textarea::placeholder{color:#aca4a1;font-size:14px}.quote-form-panel textarea{resize:vertical;min-height:95px}.form-hint{font-size:12px;color:#9d918c;line-height:1.7;margin:17px 0}.quote-review .review-check{width:42px;height:42px;border-radius:50%;background:#eae6e4;display:flex;align-items:center;justify-content:center;color:#ad323c;font-size:23px;margin-bottom:17px}.quote-review>p{font-size:15px;color:var(--muted);line-height:1.7}.quote-review pre{font:13px/1.7 var(--font);white-space:pre-wrap;overflow-wrap:anywhere;background:#f5f3f2;border:1px solid #e2dfdd;border-radius:7px;padding:16px;margin:17px 0;color:#796a63;max-height:290px;overflow:auto}.quote-review .send-note{font-size:12px;color:#94857e;margin-bottom:17px}.instagram-enquiry{display:block;font-size:12px;color:#93817a;line-height:1.7;margin-top:15px;text-align:center;text-decoration:underline;text-underline-offset:3px}.review-actions{display:flex;gap:15px;flex-wrap:wrap;justify-content:space-between;margin-top:20px}.review-actions .text-button{font-size:12px}.quote-bar{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:space-between;gap:30px;border:1px solid #61534d;border-radius:11px;padding:13px 18px;background:var(--ink);color:#ffffff;width:min(640px,calc(100% - 28px));z-index:15;box-shadow:0 6px 20px #27212225}.quote-bar>div{display:flex;align-items:center;gap:12px}.quote-bar-icon{color:#f4e9d7}.quote-bar p{display:flex;flex-direction:column;gap:2px;font-size:14px;line-height:1.4}.quote-bar strong{font-weight:600}.quote-bar p>span{color:#c3bebb;font-size:12px}.quote-bar .button{flex:none;min-height:42px;font-size:14px}.toast{position:fixed;bottom:95px;left:50%;transform:translate(-50%,15px);max-width:calc(100% - 30px);background:#f1efee;color:#7e242c;border:1px solid #d3ceca;box-shadow:0 4px 18px #27222315;border-radius:8px;padding:10px 17px;font-size:14px;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;z-index:20}.toast.visible{opacity:1;transform:translate(-50%,0)}
.review-dialog{width:860px;padding:22px}.review-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:18px}.review-dialog-heading h2{font-size:23px}.review-dialog-heading .close-button{position:static;flex:none}.review-dialog-media{display:flex;align-items:center;justify-content:center;min-height:140px;background:#f4f3f2;border-radius:8px;overflow:hidden}.review-dialog-media img,.review-dialog-media video{width:100%;max-height:62dvh;object-fit:contain;display:block}.review-dialog>p{font-size:15px;line-height:1.7;color:var(--muted);margin-top:14px}.review-dialog>a{display:inline-block;font-size:14px;text-decoration:underline;text-underline-offset:4px;margin-top:12px}
@media(min-width:1600px){.hero-copy h1,.hero-copy .hero-turn{font-size:70px}}
@media(max-width:1100px){.hero{gap:30px}.hero-copy h1,.hero-copy .hero-turn{font-size:57px}.hero-copy>p{font-size:16px}.main-nav{gap:20px}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:23px 20px}.surface-strip{font-size:12px}.custom-banner{gap:35px}.custom-banner h2{font-size:34px}.custom-text{display:none}.section-heading h2{font-size:31px}}
@media(max-width:850px){.page-width{width:calc(100% - 40px)}.announcement{padding-inline:20px}.header-inner{min-height:82px;gap:17px}.brand-type strong{font-size:25px}.main-nav{gap:17px;font-size:13px}.main-nav a:nth-child(2){display:none}.header-quote{font-size:13px;padding:11px 15px}.hero{gap:24px;padding-top:32px}.hero-copy h1,.hero-copy .hero-turn{font-size:48px;letter-spacing:-2px}.hero-copy>.eyebrow{font-size:11px;letter-spacing:.7px}.hero-copy>p{font-size:16px;line-height:1.7}.hero-media{aspect-ratio:1.1}.hero-actions .button{font-size:13px;padding:11px 14px}.hero-points{font-size:12px;gap:10px}.hero-points span+span:before{margin-right:10px}.surface-strip{display:grid;grid-template-columns:1fr 1fr;gap:13px 25px;font-size:13px}.section-heading h2{font-size:29px}.search{width:240px}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 16px}.product-title{font-size:16px}.product-info{padding:14px}.product-subtitle{font-size:14px;min-height:64px}.add-quote{font-size:13px;gap:6px}.custom-banner{padding:31px;gap:30px}.custom-banner h2{font-size:31px}.custom-banner p{font-size:16px}.steps{gap:25px}.step p{font-size:15px}.review-media-empty{display:block}.review-media-empty .button{margin-top:17px}.review-media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.faqs{grid-template-columns:.8fr 1.4fr;gap:30px}.faqs h2{font-size:29px}.quote-dialog-body{grid-template-columns:260px 1fr}.quote-form-panel{padding:25px}.quote-selection{padding:25px 20px}.form-row{gap:14px}.quote-heading{padding:25px}.quote-heading h2{font-size:26px}.detail-content{padding:29px 24px}.detail-content h2{font-size:25px}}
@media(max-width:650px){.page-width{width:calc(100% - 32px)}.announcement{justify-content:center;padding:7px 16px}.announcement>span{display:none}.announcement a{font-size:12px}.header-inner{min-height:79px;gap:12px}.brand-lockup{gap:8px}.brand-lockup>img{width:33px;height:33px}.brand-type strong{font-size:25px}.brand-type small{font-size:11px;max-width:150px;line-height:1.4;margin-top:4px}.main-nav{display:none}.header-quote{font-size:13px;min-height:43px;padding:10px 13px}.hero{grid-template-columns:1fr;gap:24px;padding:29px 0 27px}.hero-copy>.eyebrow{font-size:12px;letter-spacing:.65px;margin-bottom:16px}.hero-copy h1,.hero-copy .hero-turn{font-size:clamp(47px,9vw,60px);line-height:1.06;letter-spacing:-2.2px;margin-bottom:19px}.hero-copy>p{font-size:17px;line-height:1.75;max-width:440px;margin-bottom:23px}.hero-actions .button{font-size:14px;min-height:46px;padding:12px 18px}.hero-points{font-size:13px;gap:13px;margin-top:19px}.hero-points span+span:before{margin-right:13px}.hero-media{aspect-ratio:1.4;border-radius:12px}.hero-media figcaption{font-size:11px;bottom:12px;left:12px}.surface-strip{padding:18px 0;gap:13px 12px;font-size:12px;line-height:1.5}.surface-strip span{gap:8px}.surface-strip span:before{width:16px;height:16px;font-size:10px}.catalog{padding:32px 0}.section-heading{display:block;margin-bottom:21px}.section-heading h2{font-size:30px;line-height:1.15;letter-spacing:-.9px}.section-heading p{font-size:16px;line-height:1.7;margin-top:11px}.section-heading .eyebrow{font-size:12px;letter-spacing:.7px}.search{width:100%;margin-top:20px}.search input{font-size:16px;padding:13px 0}.category-tabs{gap:7px}.category-tab{font-size:14px;min-height:42px;padding:8px 12px}.catalog-meta{font-size:12px;margin-top:21px;margin-bottom:17px}.sort-label{font-size:12px;gap:3px}.sort-label select{font-size:13px;max-width:130px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:21px 13px}.product-card{border-radius:9px}.product-info{padding:12px}.product-category{font-size:11px;letter-spacing:0;line-height:1.4;min-height:31px;margin-bottom:6px}.product-title{font-size:16px;line-height:1.35;min-height:44px}.product-subtitle{font-size:14px;line-height:1.6;min-height:64px;margin-top:7px}.card-footer{margin-top:12px;padding-top:9px}.add-quote{font-size:13px;min-height:38px;gap:6px}.add-quote>span{height:23px;width:23px;font-size:18px}.photo-action{display:none}.preview-note{font-size:12px;line-height:1.8;margin-top:20px}.custom-banner{grid-template-columns:1fr;gap:20px;padding:29px 25px;margin-bottom:33px;border-radius:11px}.custom-banner h2{font-size:35px;letter-spacing:-1.1px}.custom-banner p{font-size:16px;line-height:1.8;margin-bottom:18px}.custom-banner .eyebrow{font-size:11px;letter-spacing:.6px;margin-bottom:12px}.steps{grid-template-columns:1fr;gap:22px}.step{padding-top:19px;display:grid;grid-template-columns:35px 1fr;gap:0 14px}.step>span{grid-row:1/3;font-size:14px;margin-top:3px}.step h3{font-size:18px;margin-bottom:9px}.step p{font-size:16px;max-width:none}.how-section{padding:12px 0 35px}.reviews-section{padding:28px 0 33px}.review-media-empty{padding:23px}.review-media-empty h3{font-size:18px}.review-media-empty p{font-size:15px}.review-media-grid{grid-template-columns:1fr}.review-card img,.review-card video{height:400px;max-height:65dvh}.faqs{grid-template-columns:1fr;gap:15px;padding:27px 0 33px}.faqs h2{max-width:none;font-size:29px}.faq-list summary{font-size:16px;padding:16px 0}.faq-list p{font-size:15px;line-height:1.8}.footer-inner{gap:19px 22px;display:grid;grid-template-columns:1fr 1fr}.footer-inner .brand-lockup{grid-column:1/-1}.footer-inner>p{grid-column:1/-1;font-size:13px}.footer-inner>a:not(.brand-lockup){font-size:13px}.footer-inner>span{font-size:12px;text-align:right}.product-dialog-layout{grid-template-columns:1fr}.detail-image{width:calc(100% - 28px);max-width:360px;margin:14px auto 0;border-radius:10px}.detail-content{padding:24px}.detail-content .close-button{position:fixed;right:22px;top:22px}.detail-content h2{font-size:27px;padding-right:28px}.detail-content>.eyebrow{padding-right:0}.detail-content>p{font-size:16px;line-height:1.75}.detail-specs{margin-bottom:19px}.spec-row{font-size:13px}.quote-dialog-body{grid-template-columns:1fr}.quote-heading{padding:23px 22px}.quote-heading h2{font-size:25px;letter-spacing:-.8px;padding-right:35px}.quote-heading p{font-size:14px;line-height:1.7}.quote-heading .close-button{right:14px;top:15px;width:35px;height:35px}.quote-selection{padding:21px 22px;border-right:0;border-bottom:1px solid var(--line)}#quote-items{max-height:250px}.selection-heading{margin-bottom:5px}.selection-empty{padding:14px 0 0}.selection-empty p{margin-bottom:6px}.quote-pricing-note{font-size:12px;margin-top:15px;line-height:1.6}.quote-pricing-note br{display:none}.quote-form-panel{padding:24px 22px}.form-row{grid-template-columns:1fr;gap:17px;margin-bottom:17px}.quote-form-panel label{font-size:14px}.quote-form-panel h3{font-size:20px}.form-hint{font-size:12px;line-height:1.8}.quote-form-panel input,.quote-form-panel select,.quote-form-panel textarea{font-size:16px}.quote-bar{bottom:12px;gap:15px;padding:12px 13px}.quote-bar p>span,.quote-bar-icon{display:none}.quote-bar p{font-size:13px}.quote-bar .button{font-size:13px;padding:11px 13px}.quote-review pre{font-size:13px}.review-actions{gap:12px}.review-dialog{padding:17px}.review-dialog-heading h2{font-size:20px}.review-dialog>p{font-size:15px}}
@media(max-width:370px){.brand-type strong{font-size:22px}.brand-type small{font-size:10px;max-width:130px}.brand-lockup>img{width:30px;height:30px}.header-quote{font-size:12px;padding:10px 11px}.hero-copy h1,.hero-copy .hero-turn{font-size:44px;letter-spacing:-1.8px}.hero-actions .button{padding:11px 14px}.product-info{padding:10px}.product-title{font-size:14px;min-height:40px}.product-subtitle{font-size:13px}.add-quote{font-size:12px;gap:5px}.add-quote>span{width:20px;height:20px;font-size:17px}.product-grid{gap:18px 11px}.quote-bar p{font-size:12px}.quote-bar .button{font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
.lang-toggle{display:flex;align-items:center;background:var(--ink);border-radius:999px;padding:4px;gap:2px;flex:none}
.lang-opt{border:none;background:transparent;border-radius:999px;font:700 13px/1 var(--font);color:rgba(255,255,255,.55);padding:8px 14px;cursor:pointer;transition:background .18s,color .18s;white-space:nowrap}
.lang-opt-active{background:var(--lime);color:var(--ink)}
.lang-opt:not(.lang-opt-active):hover{color:#ffffff}
/* Keep each row’s action buttons aligned and prevent narrow-screen text clipping. */
.product-card{display:flex;flex-direction:column}.product-photo{flex:none}.product-info{display:flex;flex-direction:column;flex:1}.product-subtitle{flex:1}.card-footer{flex:none}
@media(max-width:650px){.hero-copy h1>span{white-space:normal}}
@media(max-width:650px){.announcement{padding:7px 0}}
/* Custom Bat Stickers dedicated photo */
.photo-bat{background-image:url('assets/bat-sticker.webp')!important;background-size:cover!important;background-position:50% 28%!important;background-repeat:no-repeat!important}
.detail-image.photo-bat{aspect-ratio:533/800;background-position:50% 50%!important}
/* Helmet Stickers dedicated photo */
.photo-helmet{background-image:url('assets/helmet-3d-front.webp')!important;background-size:cover!important;background-position:50% 50%!important;background-repeat:no-repeat!important}
/* Pads & Gloves Branding dedicated photo */
.photo-pads{background-image:url('assets/pads-3d-front.webp')!important;background-size:cover!important;background-position:50% 50%!important;background-repeat:no-repeat!important}
/* Cricket Kit Bag dedicated photo (wide image: shown whole, bars blend with the photo's own backdrop) */
.photo-bag{background-image:url('assets/bag-3d-front.webp'),linear-gradient(to bottom,#bfc2cb 16.6%,#d4d6de 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
/* 3D viewer in product popup */
.detail-3d{position:relative;width:calc(100% - 36px);aspect-ratio:1;margin:18px;border-radius:10px;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#f7f9fb 0%,#e4e8ef 70%,#d9dee8 100%)}
.detail-3d-host{position:absolute;inset:0;touch-action:pan-y;cursor:grab}
.detail-3d-host canvas{width:100%;height:100%;display:block;cursor:grab}.detail-3d-host canvas.grabbing{cursor:grabbing}
.detail-3d-badge{position:absolute;top:12px;right:12px;background:#fffffff0;color:var(--ink);font-size:12px;font-weight:600;line-height:1;padding:7px 10px;border-radius:6px;box-shadow:0 2px 8px #0000001a;pointer-events:none}
@media(max-width:650px){.detail-3d{width:calc(100% - 28px);max-width:360px;margin:14px auto 0}}
/* Hero image enlarge */
.hero-zoom{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;background:transparent;cursor:zoom-in;z-index:1}
.hero-zoom:focus-visible{outline-offset:-4px}
.hero-media figcaption{z-index:2;pointer-events:none}
.zoom-dialog{width:min(1448px,calc(100vw - 32px));background:#ffffff}
.zoom-dialog>picture>img{width:100%;height:auto;display:block}
.zoom-dialog .close-button{position:fixed;top:22px;right:28px;box-shadow:0 2px 10px #0000003d}
/* Theme toggle button */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);transition:background .18s,border-color .18s}
.theme-toggle:hover{background:var(--soft);border-color:#aea6a2}
.theme-toggle svg{width:20px;height:20px}
.theme-toggle .icon-sun{display:none}
html[data-theme=dark] .theme-toggle .icon-sun{display:block}
html[data-theme=dark] .theme-toggle .icon-moon{display:none}
.header-actions{display:flex;align-items:center;gap:10px;flex:none}
@media(max-width:650px){.header-actions{gap:7px}.theme-toggle{width:40px;height:40px}.theme-toggle svg{width:18px;height:18px}}
@media(max-width:370px){.header-actions{gap:5px}.theme-toggle{width:36px;height:36px}}
/* Dark theme */
html[data-theme=dark]{color-scheme:dark;--ink:#f0eeed;--text:#d5d0ce;--muted:#a8a09d;--line:#342c29;--soft:#1d191a}
html[data-theme=dark] body{background:#121010}
html[data-theme=dark] .skip-link{background:#7a232b}
html[data-theme=dark] .announcement{background:#0b090a;color:#ddd5d2}
html[data-theme=dark] .header{background:#121010f2}
html[data-theme=dark] .brand-type strong>span{color:#d56e77}
html[data-theme=dark] .brand-lockup>img{background:#ffffff}
html[data-theme=dark] .main-nav a:hover{color:#f1e5d0}
html[data-theme=dark] .button-dark{background:#7a232b;color:#ffffff}
html[data-theme=dark] .button-dark:hover{background:#912a33}
html[data-theme=dark] .button-outline{color:#ecebea;border-color:#4e4440}
html[data-theme=dark] .button-outline:hover{background:#292320;border-color:#6f645f}
html[data-theme=dark] .eyebrow{color:#d1606a}
html[data-theme=dark] .eyebrow.muted{color:#99918e}
html[data-theme=dark] .lime-dot{color:#f1e5d0}
html[data-theme=dark] .hero-points{color:#9d9693}
html[data-theme=dark] .hero-points span+span:before{color:#615955}
html[data-theme=dark] .hero-media{background:#1d191a}
html[data-theme=dark] .hero-media figcaption{background:#121010e6;color:#c2bab7}
html[data-theme=dark] .hero-copy h1>span:after{opacity:.9}
html[data-theme=dark] .surface-strip{color:#b9b1ad}
html[data-theme=dark] .surface-strip span:before{background:#262222;color:#d56e77}
html[data-theme=dark] .section-heading p{color:var(--muted)}
html[data-theme=dark] .search{background:#191617}
html[data-theme=dark] .search svg{color:#9d9693}
html[data-theme=dark] .search:focus-within{border-color:#bf3743;box-shadow:0 0 0 2px #383233}
html[data-theme=dark] .category-tab{background:#191617;border-color:#38312e;color:#b9b1ad}
html[data-theme=dark] .category-tab:hover{background:#211e1e}
html[data-theme=dark] .category-tab.active{background:#7a232b;border-color:#7a232b;color:#ffffff}
html[data-theme=dark] .catalog-meta{color:#9d9693}
html[data-theme=dark] .sort-label select{color:#c2bab7}
html[data-theme=dark] .product-card{background:#191617}
html[data-theme=dark] .product-card:hover{border-color:#645752;box-shadow:0 6px 18px #00000040}
html[data-theme=dark] .product-photo{background-color:#27211f}
html[data-theme=dark] .photo-action{background:#121010ed;color:#ddd5d2}
html[data-theme=dark] .product-category{color:#9c9491}
html[data-theme=dark] .product-title:hover{color:#f1e5d0}
html[data-theme=dark] .product-subtitle{color:#a69e9b}
html[data-theme=dark] .custom-text{color:#99918e}
html[data-theme=dark] .add-quote>span{background:#2c2728;color:#d56e77}
html[data-theme=dark] .add-quote.selected{color:#d56e77}
html[data-theme=dark] .preview-note{color:#99918e}
html[data-theme=dark] .empty-results{border-color:#453d39}
html[data-theme=dark] .custom-banner{background:#1d191a}
html[data-theme=dark] .custom-banner .eyebrow{color:#d56e77}
html[data-theme=dark] .custom-banner p{color:#b0a9a6}
html[data-theme=dark] .step>span{color:#d56e77}
html[data-theme=dark] .review-card img,html[data-theme=dark] .review-card video{background:#1d191a}
html[data-theme=dark] .faq-list summary{color:#d2ccc9}
html[data-theme=dark] .faq-list summary>span{color:#988882}
html[data-theme=dark] footer{background:#0d0c0c}
html[data-theme=dark] .footer-inner{color:#9d9693}
html[data-theme=dark] .footer-inner>a:not(.brand-lockup){color:inherit}
html[data-theme=dark] dialog{background:#191617;color:var(--text);box-shadow:0 24px 80px #00000099}
html[data-theme=dark] dialog::backdrop{background:#060505b8}
html[data-theme=dark] .close-button{background:#221f1f;border-color:#443c38;color:#d2ccc9}
html[data-theme=dark] .close-button:hover{background:#352d2a}
html[data-theme=dark] .spec-row{color:#9d9693}
html[data-theme=dark] .spec-row strong{color:#d2ccc9}
html[data-theme=dark] .detail-quantity input{background:#121010;border-color:#443c38;color:var(--ink)}
html[data-theme=dark] .quote-selection{background:#151313}
html[data-theme=dark] .quote-item{border-color:#342c29}
html[data-theme=dark] .selection-heading>span,html[data-theme=dark] .quote-pricing-note,html[data-theme=dark] .form-hint{color:#99918e}
html[data-theme=dark] .selection-empty p{color:#a69e9b}
html[data-theme=dark] .remove-item{color:#988882}
html[data-theme=dark] .quantity-controls{background:#121010;border-color:#443c38}
html[data-theme=dark] .quantity-controls button{background:#221f1f;color:#d87880}
html[data-theme=dark] .quantity-controls button:disabled{color:#635c59}
html[data-theme=dark] .quantity-controls input{background:#121010;color:#e3dedb}
html[data-theme=dark] .text-button{color:#d56e77}
html[data-theme=dark] .quote-form-panel label{color:#b9b1ad}
html[data-theme=dark] .quote-form-panel label>span{color:#806c64}
html[data-theme=dark] .quote-form-panel input,html[data-theme=dark] .quote-form-panel select,html[data-theme=dark] .quote-form-panel textarea{background:#121010;border-color:#443c38;color:#e8e6e4}
html[data-theme=dark] .quote-form-panel input::placeholder,html[data-theme=dark] .quote-form-panel textarea::placeholder{color:#7e7673}
html[data-theme=dark] .quote-review .review-check{background:#2c2728;color:#d56e77}
html[data-theme=dark] .quote-review pre{background:#151313;border-color:#342c29;color:#e0969c}
html[data-theme=dark] .quote-review .send-note{color:#99918e}
html[data-theme=dark] .instagram-enquiry{color:#d56f78}
html[data-theme=dark] .quote-bar{background:#120f0f;border-color:#383233}
html[data-theme=dark] .toast{background:#211e1e;color:#d6cec8;border-color:#443c38}
html[data-theme=dark] .lang-toggle{background:#221f1f;box-shadow:inset 0 0 0 1px #443c38}
html[data-theme=dark] .review-dialog-media{background:#1d191a}
html[data-theme=dark] .zoom-dialog{background:#191617}
html[data-theme=dark] .theme-toggle:hover{background:#221f1f;border-color:#6f645f}
/* Small phones: keep the header (brand, language, theme, quote) on one line */
@media(max-width:420px){.header-inner{gap:8px}.header-actions{gap:6px}.lang-opt{padding:7px 9px;font-size:12px}.header-quote{padding:8px 10px;font-size:12px;min-height:38px}.theme-toggle{width:36px;height:36px}.brand-type strong{font-size:22px}}
@media(max-width:380px){.brand-type small{display:none}.brand-lockup>img{width:30px;height:30px}.header-quote{padding:8px 9px}}
@media(max-width:340px){.brand-type strong{font-size:19px}.lang-opt{padding:6px 7px}.theme-toggle{width:32px;height:32px}}
/* Badges sit on white chips over photos, so keep their text dark in dark mode */
html[data-theme=dark] .detail-3d-badge{color:#282223}
@media(max-width:440px){.brand-type small{display:none}.brand-lockup>img{width:32px;height:32px}.lang-opt{padding:7px 8px}.header-quote{padding:8px 9px}.header-actions{gap:5px}}
@media(max-width:350px){.brand-type strong{font-size:18px}.brand-lockup{gap:5px}.brand-lockup>img{width:26px;height:26px}.lang-opt{padding:6px 6px;font-size:11px}.theme-toggle{width:30px;height:30px}.theme-toggle svg{width:16px;height:16px}.header-quote{font-size:11px;padding:7px 7px}.header-inner{gap:5px}.header-actions{gap:4px}}
@media(max-width:380px){.lang-toggle{padding:3px}.lang-opt{padding:6px 7px}.header-quote{padding:8px 8px}.brand-type strong{font-size:20px;letter-spacing:-.8px}.header-inner{gap:6px}}
@media(max-width:370px){.brand-type strong{font-size:19px}.lang-opt{padding:6px 6px}.header-quote{font-size:11.5px;padding:8px 7px}.theme-toggle{width:32px;height:32px}}
@media(max-width:350px){.brand-type strong{font-size:17px}.brand-lockup{gap:5px}.brand-lockup>img{width:26px;height:26px}.lang-opt{padding:6px 5px;font-size:11px}.theme-toggle{width:30px;height:30px}.theme-toggle svg{width:16px;height:16px}.header-quote{font-size:11px;padding:7px 6px}.header-inner{gap:4px}.header-actions{gap:3px}.page-width{width:calc(100% - 24px)}}
html[data-theme=dark] .button-lime{color:#191616}
/* Team Jersey Trophies dedicated photo (wide image: shown whole, bars blend with the photo's own backdrop) */
.photo-jersey{background-image:url('assets/jersey-3d-front.webp'),linear-gradient(to bottom,#d5d8df 16.6%,#f0eef3 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-jersey{background-color:#27211f}
/* Enlarge a 3D view */
.zoom3d-dialog{width:min(1180px,calc(100vw - 24px));height:min(90dvh,860px);padding:0;overflow:hidden}
.zoom3d-dialog[open]{display:flex;flex-direction:column}
.zoom3d-bar{display:flex;align-items:center;gap:14px;padding:12px 16px;border-bottom:1px solid var(--line);flex:none}
.zoom3d-title{flex:1;min-width:0;font-size:19px;line-height:1.25;letter-spacing:-.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zoom3d-tabs{display:flex;gap:3px;padding:3px;border:1px solid var(--line);border-radius:999px;flex:none}
.zoom3d-tab{border:0;background:transparent;color:var(--muted);font:600 13px/1 var(--font);padding:9px 15px;border-radius:999px;min-height:36px}
.zoom3d-tab.active{background:var(--ink);color:#ffffff}
.zoom3d-dialog .close-button{position:static;flex:none}
.zoom3d-stage{position:relative;flex:1;min-height:0;padding:14px;display:flex}
.zoom3d-stage .detail-3d{flex:1;width:100%;max-width:none;height:100%;aspect-ratio:auto;margin:0;border-radius:12px}
.zoom3d-photo{width:100%;height:100%;object-fit:contain;border-radius:12px;background:#f1f3f4}
@media(max-width:650px){.zoom3d-dialog{width:calc(100vw - 16px);height:min(88dvh,760px)}.zoom3d-bar{gap:10px;padding:10px 12px}.zoom3d-title{font-size:16px}.zoom3d-tab{padding:8px 11px}.zoom3d-stage{padding:10px}.zoom3d-dialog .close-button{width:36px;height:36px}}
html[data-theme=dark] .zoom3d-tab.active{background:#7a232b}
html[data-theme=dark] .zoom3d-photo{background:#1d191a}
/* Leather Ball Direct Printing photo (wide image: shown whole, bars blend with the photo's backdrop) */
.photo-ball{background-image:url('assets/ball-3d-front.webp'),linear-gradient(to bottom,#eff1f7 16.6%,#ede7ed 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-ball{background-color:#27211f}
/* Ball colour chips */
.ball-swatches{position:absolute;left:12px;bottom:12px;z-index:2;display:flex;gap:8px}
.ball-swatch{width:30px;height:30px;padding:0;border:2px solid #ffffff;border-radius:50%;box-shadow:0 0 0 1px #a59f9d,0 2px 6px #00000033;cursor:pointer;transition:box-shadow .15s}
.ball-swatch-red{background:radial-gradient(circle at 35% 30%,#e0434a,#a9121a 60%,#5a070c)}
.ball-swatch-white{background:radial-gradient(circle at 35% 30%,#ffffff,#e4e3de 65%,#b8b6ae)}
.ball-swatch.active{box-shadow:0 0 0 2px #282223,0 2px 6px #00000033}
/* Customer reviews: a spotlight panel (warm light in light mode, dark in dark mode) with a 5.0 score, swipeable review cards and initials avatars */
.reviews-section,.custom-banner{--rv-bg:radial-gradient(70% 90% at 100% 0%,#f7dede 0%,#fbeeee80 45%,transparent 72%),radial-gradient(60% 80% at 0% 100%,#f4e7d6 0%,transparent 65%),#fbf8f6;--rv-border:#ece4e1;--rv-shadow:0 30px 60px -36px #5a1a1a40;--rv-seam:url("data:image/svg+xml;utf8,");
--rv-eyebrow:#9d2e37;--rv-title:#282223;--rv-text:#372e2a;--rv-name:#282223;--rv-muted:#75706d;--rv-star:#e3a30c;--rv-accent:#922a33;
--rv-score-bg:#ffffffb3;--rv-score-border:#eadfdb;--rv-card:linear-gradient(160deg,#ffffff,#fdf9f7 60%);--rv-card-hover:linear-gradient(160deg,#ffffff,#fffdfc 60%);--rv-card-border:#ece5e2;--rv-card-border-hover:#dcbcbc;--rv-card-shadow:0 14px 30px -18px #3a070b40;
--rv-line:#efe8e5;--rv-ring-gap:#ffffff;--rv-ring:#b0333e40;--rv-dot:#d9d2cf;--rv-dot-active:#922a33;--rv-btn-bg:#ffffff;--rv-btn-hover:#f6f1ef;--rv-btn-border:#d8cfcb;--rv-btn-border-hover:#b0333e66;--rv-btn-text:#282223;--rv-focus:#b0333e;--rv-cta:#282223;--rv-cta-text:#ffffff;--rv-cta-hover:#3d3435}
html[data-theme=dark] .reviews-section,html[data-theme=dark] .custom-banner{--rv-bg:radial-gradient(70% 90% at 100% 0%,#6e1118 0%,#3a070b66 45%,transparent 72%),radial-gradient(60% 80% at 0% 100%,#3a070bcc 0%,transparent 65%),#171213;--rv-border:#ffffff14;--rv-shadow:0 30px 60px -34px #000000b3;--rv-seam:url("data:image/svg+xml;utf8,");
--rv-eyebrow:#ead7b6;--rv-title:#ffffff;--rv-text:#f3efed;--rv-name:#ffffff;--rv-muted:#b9b0ad;--rv-star:#f2c94c;--rv-accent:#ead7b6;
--rv-score-bg:#ffffff0a;--rv-score-border:#ffffff1f;--rv-card:linear-gradient(160deg,#2a2223,#1c1718 60%);--rv-card-hover:linear-gradient(160deg,#322829,#201a1b 60%);--rv-card-border:#ffffff17;--rv-card-border-hover:#ead7b647;--rv-card-shadow:0 12px 30px -12px #00000080;
--rv-line:#ffffff14;--rv-ring-gap:#171213;--rv-ring:#ead7b659;--rv-dot:#ffffff33;--rv-dot-active:#ead7b6;--rv-btn-bg:#ffffff0d;--rv-btn-hover:#ffffff1f;--rv-btn-border:#ffffff33;--rv-btn-border-hover:#ead7b680;--rv-btn-text:#ffffff;--rv-focus:#ead7b6;--rv-cta:#ead7b6;--rv-cta-text:#1a1516;--rv-cta-hover:#f1e5d0}
.reviews-section{position:relative;isolation:isolate;overflow:hidden;margin-block:22px 48px;padding:46px 44px 38px;border:1px solid var(--rv-border);border-radius:24px;color:var(--rv-text);background:var(--rv-bg);box-shadow:var(--rv-shadow)}
.reviews-section::before{content:'';position:absolute;z-index:-1;top:-280px;right:-240px;width:440px;height:440px;background:var(--rv-seam) center/contain no-repeat;pointer-events:none}
.reviews-section .section-heading{align-items:flex-end;margin-bottom:30px}
.reviews-section .section-heading .eyebrow.muted{color:var(--rv-eyebrow)}
.reviews-section .section-heading h2{color:var(--rv-title)}
.rme-score{display:flex;align-items:center;gap:14px;flex:none;padding:12px 18px 12px 16px;border:1px solid var(--rv-score-border);border-radius:16px;background:var(--rv-score-bg);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.rme-score>strong{font:italic 800 46px/1 'Barlow Condensed',var(--font);color:var(--rv-accent);letter-spacing:.5px}
.rme-score>span{display:flex;flex-direction:column;gap:5px}
.rme-score-stars{font-size:17px;line-height:1;letter-spacing:2px;color:var(--rv-star)}
.rme-score small{font-size:12.5px;line-height:1.3;color:var(--rv-muted)}
.review-media-empty{display:block;padding:0;border:0;border-radius:0;background:none}
.rme-carousel{width:100%;min-width:0}
.rme-quotes{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:8px 2px 32px;margin:-8px -2px -32px}
.rme-quotes::-webkit-scrollbar{display:none}
.rme-quotes:focus-visible{outline:2px solid var(--rv-focus);outline-offset:4px;border-radius:20px}
.rme-quote{position:relative;flex:0 0 calc((100% - 18px) / 2);scroll-snap-align:start;display:flex;flex-direction:column;padding:26px 28px 22px;border:1px solid var(--rv-card-border);border-radius:20px;background:var(--rv-card);box-shadow:var(--rv-card-shadow);transition:transform .25s ease,border-color .25s ease,background .25s ease}
@media(hover:hover){.rme-quote:hover{transform:translateY(-4px);border-color:var(--rv-card-border-hover);background:var(--rv-card-hover)}}
.rme-stars{font-size:17px;line-height:1;letter-spacing:3px;color:var(--rv-star);margin-bottom:16px}
.rme-quote .rme-text{flex:1;max-width:none;margin:0 0 20px;font-size:16.5px;line-height:1.7;font-weight:400;color:var(--rv-text)}
.rme-by{display:flex;align-items:center;gap:12px;padding-top:18px;border-top:1px solid var(--rv-line)}
.rme-avatar{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:linear-gradient(140deg,#c23a45,#6e1118);color:#ffffff;font:700 15px/1 var(--font);letter-spacing:.5px;box-shadow:0 0 0 2px var(--rv-ring-gap),0 0 0 3.5px var(--rv-ring)}
.rme-quote:nth-child(even) .rme-avatar{background:linear-gradient(140deg,#f5e8d3,#d9bf95);color:#3a070b}
.rme-quote .rme-author{max-width:none;margin:0;font-size:15px;font-weight:650;line-height:1.3;color:var(--rv-name)}
.rme-quote .rme-author small{display:block;margin-top:2px;font-size:12.5px;font-weight:500;color:var(--rv-muted)}
.rme-controls{display:flex;justify-content:center;margin-top:22px}
.rme-dots{display:flex;align-items:center;gap:8px}
.rme-dot{width:9px;height:9px;padding:0;border:0;border-radius:99px;background:var(--rv-dot);transition:width .25s,background .25s;cursor:pointer}
.rme-dot.active{width:28px;background:var(--rv-dot-active)}
.rme-cta{display:flex;justify-content:center;margin-top:26px}
.rme-ig{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;border:1px solid var(--rv-btn-border);border-radius:999px;background:var(--rv-btn-bg);color:var(--rv-btn-text);font-weight:650;transition:background .2s,border-color .2s}
.rme-ig svg{flex:none;color:var(--rv-accent)}
.rme-ig:hover{background:var(--rv-btn-hover);border-color:var(--rv-btn-border-hover)}
/* "Your idea" banner: the same spotlight panel as the reviews (warm cream in light mode, dark in dark mode) */
section.custom-banner.page-width{position:relative;isolation:isolate;overflow:hidden;padding:46px 44px;border:1px solid var(--rv-border);border-radius:24px;background:var(--rv-bg);box-shadow:var(--rv-shadow)}
section.custom-banner.page-width::before{content:'';position:absolute;z-index:-1;top:-280px;right:-290px;width:440px;height:440px;background:var(--rv-seam) center/contain no-repeat;pointer-events:none}
section.custom-banner.page-width .eyebrow{color:var(--rv-eyebrow)}
section.custom-banner.page-width h2{color:var(--rv-title)}
section.custom-banner.page-width p{color:var(--rv-muted)}
section.custom-banner.page-width .button{border-color:var(--rv-cta);background:var(--rv-cta);color:var(--rv-cta-text)}
section.custom-banner.page-width .button:hover{border-color:var(--rv-cta-hover);background:var(--rv-cta-hover)}
@media(max-width:650px){section.custom-banner.page-width{padding:30px 22px;border-radius:20px}section.custom-banner.page-width::before{top:-200px;right:-180px;width:320px;height:320px}}
/* cards and score rise in once when the section scrolls into view (class added by app.js) */
@keyframes rmeIn{from{opacity:0;transform:translateY(24px)}}
.rme-anim .rme-quote,.rme-anim .rme-score{opacity:0}
.rme-anim.rme-in .rme-quote,.rme-anim.rme-in .rme-score{opacity:1;animation:rmeIn .7s cubic-bezier(.2,.7,.2,1) backwards}
.rme-anim.rme-in .rme-score{animation-delay:.15s}
.rme-anim.rme-in .rme-quote:nth-child(2){animation-delay:.1s}
.rme-anim.rme-in .rme-quote:nth-child(3){animation-delay:.2s}
@media(prefers-reduced-motion:reduce){.rme-quotes{scroll-behavior:auto}.rme-quote{transition:none}}
@media(max-width:850px){.reviews-section{padding:38px 28px 32px;border-radius:22px}}
@media(max-width:700px){.rme-quote{flex-basis:86%}}
@media(max-width:650px){
.reviews-section{margin-block:10px 34px;padding:30px 18px 26px;border-radius:20px}
.reviews-section::before{top:-200px;right:-180px;width:320px;height:320px}
.reviews-section .section-heading{display:block;margin-bottom:22px}
.rme-score{display:inline-flex;margin-top:16px;padding:10px 14px}
.rme-score>strong{font-size:38px}
.rme-quote{padding:22px 20px 18px}
.rme-quote .rme-text{font-size:15.5px}
}
/* Hero headline: Brand it. Print it. Ship it. */
.hero-copy h1>span.hero-ship{color:#922a33}
.hero-copy h1>span.hero-ship:after{display:none}
.hero-copy>p{max-width:470px}
html[data-theme=dark] .hero-copy h1>span.hero-ship{color:#d56e77}
@media(max-width:850px){.hero-copy>p{max-width:none}}
/* Custom Hard-Surface Stickers photo (wide image on a white backdrop: shown whole) */
.photo-bottle{background-image:url('assets/surface-3d-front.webp'),linear-gradient(to bottom,#e8ebf0 16.6%,#f4f3f7 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-bottle{background-color:#27211f}
/* Custom Photo Caricatures photo (wide image: shown whole, bars blend with the photo's backdrop) */
.photo-caricature{background-image:url('assets/caricature-3d-front.webp'),linear-gradient(to bottom,#e7ebf3 16.6%,#f5f5f8 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-caricature{background-color:#27211f}
/* TPU Rubber Patches photo (wide image: shown whole, bars blend with the photo's backdrop) */
.photo-patch{background-image:url('assets/tpu-3d-front.webp'),linear-gradient(to bottom,#e2e4ea 16.6%,#e4e6ec 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-patch{background-color:#27211f}
/* Acrylic Trophies photo (wide image: shown whole, bars blend with the photo's backdrop) */
.photo-trophy{background-image:url('assets/trophy-3d-front.webp'),linear-gradient(to bottom,#e9edf4 16.6%,#f2eff3 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-trophy{background-color:#27211f}
/* Custom Medals photo (wide image on white: shown whole) */
.photo-medal{background-image:url('assets/medal-3d-front.webp'),linear-gradient(to bottom,#e9edf5 16.6%,#f7f5f6 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-medal{background-color:#27211f}
/* ===== Phone and touch friendliness ===== */
.menu-toggle{display:none;align-items:center;justify-content:center;flex:none;width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink)}
.menu-bars{position:relative;width:20px;height:14px;display:block}.menu-bars i{position:absolute;left:0;width:20px;height:2px;border-radius:2px;background:currentColor;transition:transform .2s,opacity .2s,top .2s}
.menu-bars i:nth-child(1){top:0}.menu-bars i:nth-child(2){top:6px}.menu-bars i:nth-child(3){top:12px}
.menu-toggle[aria-expanded=true] .menu-bars i:nth-child(1){top:6px;transform:rotate(45deg)}.menu-toggle[aria-expanded=true] .menu-bars i:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] .menu-bars i:nth-child(3){top:6px;transform:rotate(-45deg)}
.mobile-menu{position:fixed;left:0;right:0;top:var(--menu-top,86px);z-index:12;background:#fffffffa;backdrop-filter:blur(12px);border-bottom:1px solid var(--line);box-shadow:0 18px 40px #1c171822;padding:6px 16px 16px;max-height:calc(100dvh - var(--menu-top,86px));overflow:auto;animation:menuIn .18s ease-out}
@keyframes menuIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.mobile-menu nav{display:flex;flex-direction:column}
.mobile-menu nav a{display:flex;align-items:center;min-height:52px;padding:0 4px;font-size:17px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--line)}
.mobile-menu nav a:active{background:var(--soft)}
.menu-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}
.menu-lang{display:flex;gap:2px;padding:4px;background:var(--ink);border-radius:999px}
.menu-lang-btn{border:0;background:transparent;color:rgba(255,255,255,.65);font:700 14px/1 var(--font);padding:11px 18px;border-radius:999px;min-height:40px}
.menu-lang-btn.active{background:var(--lime);color:#282223}
.menu-theme{display:inline-flex;align-items:center;gap:9px;min-height:48px;padding:0 18px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);font:600 15px/1 var(--font)}
.menu-theme .icon-sun{display:none}html[data-theme=dark] .menu-theme .icon-sun{display:block}html[data-theme=dark] .menu-theme .icon-moon{display:none}
.back-top{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:calc(86px + env(safe-area-inset-bottom));z-index:14;display:flex;align-items:center;justify-content:center;width:46px;height:46px;border:0;border-radius:50%;background:var(--ink);color:#ffffff;box-shadow:0 6px 18px #1c171840}
html[data-theme=dark] .mobile-menu{background:#121010fa}html[data-theme=dark] .back-top{background:#7a232b}
html[data-theme=dark] .menu-lang{background:#221f1f;box-shadow:inset 0 0 0 1px #443c38}
@media(max-width:850px){
.main-nav,.header .lang-toggle,.header #theme-toggle{display:none!important}
.menu-toggle{display:inline-flex}
.header-actions{gap:8px}
.category-tabs{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-inline:-20px;padding:2px 20px 6px}
.category-tabs::-webkit-scrollbar{display:none}
.category-tab{flex:none;min-height:46px;scroll-snap-align:start;font-size:15px}
}
@media(max-width:650px){
.category-tabs{margin-inline:-16px;padding-inline:16px}
html{scroll-padding-top:84px}
.quote-bar{bottom:calc(12px + env(safe-area-inset-bottom))}
.toast{bottom:calc(92px + env(safe-area-inset-bottom))}
/* product popup becomes a bottom sheet that fills the width */
.product-dialog{width:100vw;max-width:100vw;max-height:94dvh;margin:auto 0 0;border-radius:22px 22px 0 0;padding-bottom:env(safe-area-inset-bottom)}
.detail-content{padding-bottom:18px}
.detail-content #detail-add{position:sticky;bottom:10px;z-index:3;min-height:52px;box-shadow:0 8px 22px #1c171847}
/* quote form uses the whole screen */
.quote-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border-radius:0}
.quote-form-panel button[type=submit]{min-height:54px;position:sticky;bottom:10px;box-shadow:0 8px 22px #1c171847}
.zoom3d-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border-radius:0}
.review-dialog{width:100vw;max-width:100vw;margin:auto 0 0;border-radius:22px 22px 0 0}
}
/* the 3D pictures: let a vertical swipe scroll the sheet, a horizontal swipe turn the object */
.detail-3d-host canvas{touch-action:pan-y!important}
.zoom3d-stage .detail-3d-host canvas{touch-action:none!important}
@media(pointer:coarse){
.button,.add-quote,.text-button,.product-title,.faq-list summary{min-height:48px}
.quantity-controls{height:44px}.quantity-controls button{height:42px;width:44px;font-size:22px}.quantity-controls input{width:64px;font-size:16px}
.remove-item{width:44px;height:44px}.close-button{width:46px;height:46px}
.quote-form-panel input,.quote-form-panel select,.quote-form-panel textarea{min-height:48px;font-size:16px}
.footer-inner>a:not(.brand-lockup){min-height:44px}
.photo-action{display:none}
}
@media(hover:none){.product-card:hover{box-shadow:none}.product-photo:active{opacity:.92}}
@media(min-width:851px){.mobile-menu,.menu-toggle{display:none!important}}
@media(max-width:350px){.category-tabs{margin-inline:-12px;padding-inline:12px}}
/* bigger touch areas without changing how things look */
.rme-arrow{width:44px;height:44px}
.rme-dot{position:relative}.rme-dot:after{content:'';position:absolute;inset:-15px -7px}
.brand-lockup{min-height:44px}
@media(pointer:coarse){.sort-label select{min-height:44px;font-size:16px}.rme-controls{gap:14px}}
.rme-arrow{flex:none;min-width:44px}
/* Hero picture: shown on computers and tablets, hidden on phones */
@media(max-width:650px){.hero-media{display:none}}
/* Catalog heading: one line */
.catalog-line{white-space:nowrap;font-size:clamp(20px,6vw,34px);margin:0}
.section-heading:has(.catalog-line){align-items:center}
@media(max-width:650px){.section-heading:has(.catalog-line){margin-bottom:16px}.section-heading:has(.catalog-line) .search{margin-top:14px}}
.section-heading h2.catalog-line{white-space:nowrap;font-size:clamp(18px,5.8vw,34px);letter-spacing:-.6px;line-height:1.2}
.section-heading:has(.catalog-line) p{margin-top:8px;font-size:16px}
.rme-controls{justify-content:center;padding-left:0}
.rme-hint,.rme-arrow{display:none}
/* Custom Fridge Magnets photo (near-square image: shown whole) */
.photo-magnet{background-image:url('assets/magnet-3d-front.webp'),linear-gradient(to bottom,#e5e9f1,#f4f5f9)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-magnet{background-color:#27211f}
/* Acrylic Keychains photo (wide image on a light backdrop: shown whole) */
.photo-keychain{background-image:url('assets/keychain-3d-front.webp'),linear-gradient(to bottom,#e7e9ee 16.6%,#e7e8ed 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-keychain{background-color:#27211f}
/* PC / tablet hero: dark green banner, photo on the right fading into the green */
@media(min-width:651px){
.hero.page-width{position:relative;display:flex;align-items:center;width:100%;max-width:none;margin:0;padding:72px max(32px,calc((100% - 1280px)/2)) 64px;min-height:580px;background:#1a1516;overflow:hidden;isolation:isolate;gap:0}
.hero-copy{position:relative;z-index:2;max-width:min(580px,56%)}
.hero-media{position:absolute;top:0;right:0;bottom:0;left:auto;width:70%;aspect-ratio:auto;border-radius:0;background:none;z-index:0;overflow:hidden}
.hero-media>picture>img{width:100%;height:100%;object-fit:cover;object-position:right center;-webkit-mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.35) 16%,rgba(0,0,0,.8) 36%,#000000 54%);mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.35) 16%,rgba(0,0,0,.8) 36%,#000000 54%)}
.hero-media figcaption{display:none}
.hero-zoom{z-index:1}
.hero .eyebrow{color:#ead7b6}
.hero-copy h1,.hero-copy .hero-turn{color:#ffffff}
.hero-copy h1>span.hero-ship{color:#ead7b6}
.hero-copy>p{color:#dfdcda}
.hero .button-dark{background:#ead7b6;color:#1a1516;border-color:#ead7b6}
.hero .button-dark:hover{background:#f1e5d0}
.hero .button-outline{color:#ffffff;border-color:#ffffff66;background:transparent}
.hero .button-outline:hover{background:#ffffff1a;border-color:#ffffff}
html[data-theme=dark] .hero-copy h1,.hero-copy .hero-turn{color:#ffffff}
html[data-theme=dark] .hero .button-dark{background:#ead7b6;color:#1a1516}
html[data-theme=dark] .hero .eyebrow,html[data-theme=dark] .hero-copy h1>span.hero-ship{color:#ead7b6}
html[data-theme=dark] .hero-copy>p{color:#dfdcda}
html[data-theme=dark] .hero .button-outline{color:#ffffff}
}
@media(min-width:651px) and (max-width:850px){.hero.page-width{min-height:520px;padding-block:56px}.hero-copy{max-width:60%}.hero-media{width:78%}}
@media(min-width:651px){
.hero-media{width:64%}
.hero-media>picture>img{-webkit-mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.2) 24%,rgba(0,0,0,.7) 50%,#000000 72%);mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.2) 24%,rgba(0,0,0,.7) 50%,#000000 72%)}
.hero-copy{max-width:min(560px,52%)}
.hero-zoom:focus:not(:focus-visible){outline:none}
.hero-copy>p{text-shadow:0 1px 10px #1a1516}
}
@media(min-width:651px) and (max-width:850px){.hero-media{width:80%}.hero-copy{max-width:58%}}
@media(min-width:651px) and (max-width:900px){.section-heading:has(.catalog-line){flex-wrap:wrap}.section-heading:has(.catalog-line) .search{width:100%;margin-top:6px}}
/* Phone hero: same dark green + lime look as the PC hero, no picture */
@media(max-width:650px){
.hero.page-width{position:relative;width:100%;max-width:none;margin:0;padding:34px 20px 38px;background:radial-gradient(120% 70% at 100% 0%,#ead7b62e 0%,#ead7b600 58%),radial-gradient(90% 60% at 0% 100%,#7a232b40 0%,#7a232b00 60%),#1a1516;border-radius:0;overflow:hidden;isolation:isolate}
.hero .eyebrow{color:#ead7b6}
.hero-copy h1,.hero-copy .hero-turn{color:#ffffff}
.hero-copy h1>span.hero-ship{color:#ead7b6}
.hero-copy>p{color:#dfdcda;max-width:none;margin-bottom:26px}
.hero-actions{gap:10px}
.hero-actions .button{flex:1 1 0;min-height:52px;white-space:nowrap}
.hero .button-dark{background:#ead7b6;color:#1a1516;border-color:#ead7b6}
.hero .button-dark:active{background:#f1e5d0}
.hero .button-outline{color:#ffffff;border-color:#ffffff66;background:transparent}
.hero .button-outline:active{background:#ffffff1a}
html[data-theme=dark] .hero-copy h1,.hero-copy .hero-turn{color:#ffffff}
html[data-theme=dark] .hero .button-dark{background:#ead7b6;color:#1a1516}
html[data-theme=dark] .hero .eyebrow,html[data-theme=dark] .hero-copy h1>span.hero-ship{color:#ead7b6}
html[data-theme=dark] .hero-copy>p{color:#dfdcda}
html[data-theme=dark] .hero .button-outline{color:#ffffff}
.surface-strip{margin-top:6px}
}
.photo-box{background-image:url('assets/box-3d-front.webp'),linear-gradient(to bottom,#dde4f1 16.6%,#e9ebf2 83.4%)!important;background-size:contain,100% 100%!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important}
html[data-theme=dark] .photo-box{background-color:#27211f}
@media(max-width:650px){
html,body,*{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar,*::-webkit-scrollbar{display:none;width:0;height:0}
}
@media(max-width:850px){.category-tabs{scroll-padding-inline:20px}}
@media(max-width:650px){.category-tabs{scroll-padding-inline:16px}}
@media(max-width:350px){.category-tabs{scroll-padding-inline:12px}}
/* hero tagline: words slide up one by one, then the brand name's words slide up one by one */
.hero-swap{display:grid;margin:-8px 0 14px;padding:8px 0;overflow:hidden}
.hero-swap>*{grid-area:1/1}
.hero-swap h1{margin-bottom:0!important}
.tw{display:inline-block;font-weight:inherit;animation:tagCycle 13.5s cubic-bezier(.7,0,.2,1) infinite;animation-delay:var(--d,0s)}
.hero-brand{align-self:center;display:flex;flex-direction:column;align-items:flex-start;gap:14px;pointer-events:none}
.bw{display:inline-block;transform:translateY(320px);animation:brandCycle 13.5s cubic-bezier(.7,0,.2,1) infinite;animation-delay:var(--d,0s)}
.hero-brand-name{font-size:clamp(50px,5.6vw,78px);font-weight:800;line-height:1;letter-spacing:-3px;white-space:nowrap;color:#ffffff}
.hero-brand-name span{color:#ead7b6;filter:drop-shadow(0 0 14px #ead7b688)}
.hero-brand-line{display:block;height:4px;width:min(100%,260px);border-radius:2px;background:linear-gradient(90deg,#ead7b6,#ead7b600)}
.hero-brand-sub{font-size:13px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:#d2c9c3}
@keyframes tagCycle{0%,24%{transform:none}28%,95.9%{transform:translateY(-320px)}95.91%{transform:translateY(320px)}100%{transform:none}}
@keyframes brandCycle{0%,32%{transform:translateY(320px)}36%,56%{transform:none}60%{transform:translateY(-320px)}60.01%,100%{transform:translateY(320px)}}
@keyframes turnCycle{0%,64%{transform:translateY(320px)}68%,88%{transform:none}92%{transform:translateY(-320px)}92.01%,100%{transform:translateY(320px)}}
@media(max-width:1100px){.hero-brand-name{font-size:64px}}
@media(max-width:650px){.hero-brand-name{font-size:52px;letter-spacing:-2px}.hero-brand-sub{font-size:11px;letter-spacing:2.2px}}
@media(max-width:370px){.hero-brand-name{font-size:44px}}
@media(prefers-reduced-motion:reduce){.tw{animation:none}.hero-brand,.hero-turn{display:none}}
/* catalog heading: PRODUCT CATALOG in a bold italic display face */
.section-heading h2.catalog-heading{font-family:'Barlow Condensed','DM Sans',sans-serif;font-style:italic;font-weight:900;text-transform:uppercase;letter-spacing:.03em;line-height:1;font-size:clamp(30px,10.5vw,66px);color:#262021;display:flex;align-items:center;gap:.28em;white-space:nowrap}
.catalog-heading .ch-b{background:linear-gradient(100deg,#8e2932 0%,#c8424d 70%,#ead7b6 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-right:.06em}
html[data-theme=dark] .section-heading h2.catalog-heading{color:#ffffff}
html[data-theme=dark] .catalog-heading .ch-b{background:linear-gradient(100deg,#c8424d 0%,#ead7b6 100%);-webkit-background-clip:text;background-clip:text}
/* category chips: rounded pills with a cleaner font */
.category-tab{border-radius:999px;padding:9px 20px;font-family:inherit;font-weight:650;font-size:14.5px;letter-spacing:.1px;color:#554944;background:#f4f3f2;border:1.5px solid #dbd6d3;box-shadow:0 1px 2px #2620210d;transition:background .18s,border-color .18s,color .18s,transform .18s,box-shadow .18s}
.category-tab:hover{background:#ece8e6;border-color:#c7beb8;transform:translateY(-1px);box-shadow:0 4px 10px #26202114}
.category-tab.active{background:var(--ink);border-color:var(--ink);color:#ffffff;box-shadow:0 4px 12px #26202133}
.product-category{display:block;width:fit-content;max-width:100%;min-height:0!important;margin-bottom:9px!important;padding:4px 11px;border-radius:999px;background:#f1eeec;border:1px solid #ded9d5;color:#645650!important;font-size:11.5px!important;font-weight:650;letter-spacing:.2px!important;line-height:1.35!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-theme=dark] .category-tab{background:#191617;border-color:#38312e;color:#c8c0bd}
html[data-theme=dark] .category-tab:hover{background:#211e1e;border-color:#50443f}
html[data-theme=dark] .category-tab.active{background:#7a232b;border-color:#7a232b;color:#ffffff}
html[data-theme=dark] .product-category{background:#211e1e;border-color:#3f3531;color:#e1989e!important}
@media(max-width:850px){.category-tab{padding:8px 18px;font-size:15px}}
/* hero photo: show the whole picture (no cropping) - the hero grows to the photo's shape */
@media(min-width:651px){
.hero.page-width{--hw:min(64vw,1180px);min-height:calc(var(--hw) / 1.7324)}
.hero-media{top:50%;bottom:auto;height:auto;width:var(--hw);aspect-ratio:1651/953;transform:translateY(-50%)}
.hero-media>picture>img{height:100%;object-fit:contain}
}
@media(min-width:651px) and (max-width:850px){.hero.page-width{--hw:80vw;min-height:max(520px,calc(var(--hw) / 1.7324))}}
/* footer: WhatsApp + Instagram stacked on the left, Maps + copyright stacked on the right (phones) */
@media(max-width:650px){
.footer-inner{align-items:start}
.footer-inner>.footer-wa{grid-column:1;grid-row:3}
.footer-inner>.footer-ig{grid-column:1;grid-row:4}
.footer-inner>.footer-map{grid-column:2;grid-row:3}
.footer-inner>.footer-copy{grid-column:2;grid-row:4;text-align:left;align-self:center;padding-left:23px}
.footer-inner>.footer-ig,.footer-inner>.footer-wa,.footer-inner>.footer-map{min-height:34px}
}
@media(max-width:650px){.footer-inner{row-gap:6px}.footer-inner>.brand-lockup{margin-bottom:6px}.footer-inner>p{margin-bottom:8px}}
/* footer (phones): copyright ends right under the end of "Find us on Maps" */
@media(max-width:650px){.footer-inner>.footer-copy{padding-left:0}}
@media(max-width:650px){.footer-inner{grid-template-columns:1fr auto}.footer-inner>.footer-map{justify-self:start}.footer-inner>.footer-copy{justify-self:end;text-align:right}}
/* third scene: "Turn your idea into a product." - same slide-up style and speed */
.hero-swap .hero-turn{margin:0!important;align-self:center;pointer-events:none;color:#ffffff}
.cw{display:inline-block;font-weight:inherit;transform:translateY(320px);animation:turnCycle 13.5s cubic-bezier(.7,0,.2,1) infinite;animation-delay:var(--d,0s)}
.cw-lime{color:#ead7b6}
/* PC hero: catalogue + WhatsApp buttons and a trust strip (phones keep their own buttons) */
.hero-actions-pc,.hero-trust{display:none}
@media(min-width:651px){
.hero-actions{display:none}
.hero-actions-pc{display:flex;flex-wrap:wrap;gap:14px;margin-top:6px}
.hero-actions-pc .button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 24px;border-radius:14px;font-size:16px;font-weight:650;white-space:nowrap}
.hero-actions-pc .button-outline{background:#ffffff0d;border:1px solid #ffffff3d;color:#ffffff;backdrop-filter:blur(4px)}
.hero-actions-pc .button-outline:hover{background:#ffffff1c}
.hero-actions-pc .button-outline svg{color:#ead7b6}
.hero.page-width{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:1fr auto;align-items:center;min-height:calc(var(--hw) / 1.7324 + 104px);padding-bottom:30px}
.hero-copy{max-width:min(580px,64%);justify-self:start}
.hero-media{top:0;transform:none}
.hero-trust{display:grid;grid-column:1/-1;grid-row:2;grid-template-columns:repeat(4,auto);justify-content:start;list-style:none;margin:0;padding:22px 0 0;position:relative;z-index:3}
.hero-trust li{display:flex;align-items:center;gap:14px;padding:0 30px;border-left:1px solid #ffffff26;color:#ead7b6}
.hero-trust li:first-child{padding-left:0;border-left:0}
.hero-trust svg{flex:none}
.hero-trust span{display:flex;flex-direction:column;gap:2px}
.hero-trust b{font-size:16px;font-weight:650;color:#ffffff;line-height:1.25}
.hero-trust small{font-size:13.5px;color:#c7c0bd;line-height:1.3}
}
@media(min-width:651px) and (max-width:950px){
.hero.page-width{min-height:max(620px,calc(var(--hw) / 1.7324 + 170px))}
.hero-trust{grid-template-columns:repeat(2,auto);row-gap:16px}
.hero-trust li:nth-child(3){padding-left:0;border-left:0}
.hero-actions-pc .button{min-height:52px;padding:0 18px;font-size:15px}
}
/* phone hero: "Get a Quote" uses the same cream fill as "Explore products" (its item count turns dark to stay visible) */
@media(max-width:650px){
.hero .hero-actions .button.hero-quote-btn{background:#ead7b6;color:#1a1516;border-color:#ead7b6}
.hero .hero-actions .button.hero-quote-btn:active{background:#f1e5d0}
.hero .hero-actions .button.hero-quote-btn .quote-count{background:#1a1516;color:#ead7b6}
}
/* How it works: each step has a round icon badge with its number, joined to the next by a dashed ball-stitch line */
.how-section .steps{--step-gap:35px;gap:var(--step-gap)}
.how-section .step{position:relative;padding:0;border:0}
.step-badge{position:relative;display:grid;place-items:center;width:64px;height:64px;margin-bottom:20px;border:2px solid #ead7b6;border-radius:50%;background:#ffffff;color:#922a33;box-shadow:0 10px 22px -12px #3a070b80;transition:transform .25s ease}
.step-num{position:absolute;top:-7px;right:-12px;min-width:32px;height:22px;padding:0 7px;border-radius:999px;background:#922a33;color:#fff5e6;box-shadow:0 0 0 3px #ffffff;font:italic 800 15px/22px 'Barlow Condensed','DM Sans',sans-serif;letter-spacing:.04em;text-align:center}
.how-section .step:not(:last-child)::after{content:'';position:absolute;top:31px;left:80px;right:calc(12px - var(--step-gap));border-top:2px dashed #d9b3b6}
@media(hover:hover){.how-section .step:hover .step-badge{transform:translateY(-3px)}}
html[data-theme=dark] .step-badge{border-color:#4a3b3a;background:#1d191a;color:#e0969c;box-shadow:0 10px 22px -12px #000000cc}
html[data-theme=dark] .step-num{background:#b0333e;box-shadow:0 0 0 3px #121010}
html[data-theme=dark] .how-section .step:not(:last-child)::after{border-color:#5a3a3c}
@media(max-width:850px){.how-section .steps{--step-gap:25px}}
@media(max-width:650px){
.how-section .steps{--step-gap:28px}
.how-section .step{grid-template-columns:64px 1fr;gap:0 18px;padding:0}
.how-section .step .step-badge{grid-row:1/3;margin:0}
.how-section .step h3{margin-top:6px}
.how-section .step:not(:last-child)::after{top:74px;bottom:calc(8px - var(--step-gap));left:31px;right:auto;border-top:0;border-left:2px dashed #d9b3b6}
html[data-theme=dark] .how-section .step:not(:last-child)::after{border-color:#5a3a3c}
}
/* Bestsellers: a starred filter tab, and a red "Bestseller" badge beside the category on those cards (star only on phones) */
.bestseller-tab svg{margin:0 6px -2px 0;color:#e3a30c}
.bestseller-tab.active svg{color:#f2c94c}
.card-tags{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:9px}
.card-tags .product-category{margin-bottom:0!important}
.bestseller-tag{display:inline-flex;align-items:center;gap:5px;padding:4px 10px 4px 8px;border-radius:999px;background:linear-gradient(135deg,#b0333e,#7a1219);color:#fff5e6;font-size:11.5px;font-weight:700;line-height:1.4;letter-spacing:.2px;white-space:nowrap;box-shadow:0 2px 6px -2px #7a121966}
.bestseller-tag svg{flex:none;color:#f2c94c}
@media(max-width:650px){
.card-tags{flex-wrap:nowrap;gap:5px}
.card-tags .product-category{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bestseller-tag{flex:none;justify-content:center;width:24px;height:24px;padding:0}
.bestseller-tag span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
/* Customised Miniature Bat photo (stand-in: the full bat shown whole on a soft background, square) */
.photo-minibat{background-image:url('assets/minibat-placeholder.jpg')!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}
/* quote form: country code menu next to the WhatsApp number, with a short hint under it */
.quote-form-panel .phone-field{display:flex;gap:8px;color:inherit}
.quote-form-panel .phone-field select{flex:0 0 112px;width:112px;padding-right:4px;text-overflow:ellipsis}
.quote-form-panel .phone-field input{flex:1}
.phone-hint{font-size:12px;font-weight:400;color:#8e8582}
html[data-theme=dark] .phone-hint{color:#8f8784}
/* quote form: "I have a logo or design to share" checkbox, and the tip shown after preparing the message */
.quote-form-panel .design-check{flex-direction:row;align-items:center;gap:10px;min-height:44px;margin-top:10px;color:var(--ink);font-weight:500;cursor:pointer}
.quote-form-panel .design-check input{flex:none;width:20px;height:20px;min-height:0;margin:0;padding:0;accent-color:#922a33;cursor:pointer}
.design-next{display:flex;align-items:flex-start;gap:10px;margin-top:14px;padding:12px 14px;border:1px solid #cfe6d8;border-radius:8px;background:#f1f8f4;color:#24553b;font-size:13px;line-height:1.55}
.design-next svg{flex:none;margin-top:1px}
.design-next p{margin:0}
html[data-theme=dark] .quote-form-panel .design-check{color:#e8e6e4}
html[data-theme=dark] .quote-form-panel .design-check input{accent-color:#d56e77}
html[data-theme=dark] .design-next{border-color:#24402f;background:#13201a;color:#a8d5b9}
/* quote form: privacy line (shown when the enquiry log is on) and a hidden field that only spam bots fill in */
.privacy-note{margin:14px 0 -8px;font-size:12px;line-height:1.6;color:#9d918c}
html[data-theme=dark] .privacy-note{color:#99918e}
.quote-form-panel .hp-field{position:absolute;left:-10000px;width:1px;height:1px;opacity:0;pointer-events:none}
/* phone hero: a small trust list under the buttons (Since 1995, Low MOQ, Worldwide Delivery), one per line */
@media(max-width:650px){
.hero-trust{display:flex;flex-direction:column;gap:16px;list-style:none;margin:0;padding:6px 0 0;position:relative;z-index:2;text-shadow:0 2px 14px #00000080}
.hero-trust li{display:flex;align-items:center;gap:12px;color:#ead7b6}
.hero-trust li:nth-child(3){display:none}
.hero-trust svg{flex:none;width:24px;height:24px}
.hero-trust b{font-size:17px;font-weight:650;color:#ffffff;line-height:1.3}
.hero-trust small{display:none}
}
.hero-quote-btn .quote-count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:99px;background:#ead7b6;color:#1a1516;font-size:12px;font-weight:700}
.hero-quote-btn .quote-count[hidden]{display:none}
/* phone hero: red leather ball surface - grain, raised seam and cream stitching that crawls slowly along the seam */
.hero-bg{display:none}
@media(max-width:650px){
.hero.page-width{background:radial-gradient(120% 80% at 22% 12%,#a8222a 0%,#6e1118 42%,#3a070b 76%,#1b0305 100%)!important;padding-bottom:44px!important}
.hero-copy{position:relative;z-index:2;text-shadow:0 2px 14px #00000080}
.hero-bg{display:block;position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.hero-bg>i{position:absolute;display:block}
.lb-grain{inset:0;background-image:url("data:image/svg+xml;utf8,");mix-blend-mode:overlay;opacity:.95}
.lb-vig{inset:0;background:radial-gradient(100% 72% at 50% 38%,transparent 42%,#000000aa 100%)}
.lb-shine{left:-25%;top:-8%;width:95%;height:46%;background:radial-gradient(ellipse at 50% 50%,#ffffff55,transparent 66%);filter:blur(10px);transform:rotate(-22deg)}
.lb-seam{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 1px 1.5px #00000099)}
.lb-st{animation:lbStitch 130s linear infinite}
}
@keyframes lbStitch{to{stroke-dashoffset:-1700}}
@media(prefers-reduced-motion:reduce){.lb-st{animation:none}}
/* phone hero: the 3D ball (ball-hero.js) replaces the flat leather once it is ready */
@media(max-width:650px){
.lb-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-bg.lb-3d .lb-grain,.hero-bg.lb-3d .lb-seam,.hero-bg.lb-3d .lb-shine{display:none}
.hero-bg.lb-3d .lb-vig{background:radial-gradient(115% 85% at 50% 42%,transparent 38%,#00000088 100%),linear-gradient(90deg,#00000066 0%,#00000030 65%,transparent 100%),linear-gradient(180deg,#0000004d 0%,transparent 40%,#00000040 100%)}
}
/* product pop-up on phones: the close button lives inside the sheet and stays put while you scroll */
.sheet-close{display:none}
@media(max-width:650px){
.detail-content .close-button{display:none}
.sheet-close{display:flex;justify-content:flex-end;position:sticky;top:0;height:0;z-index:30;padding:0 12px;pointer-events:none}
.sheet-close .close-button{position:static;flex:none;width:44px;height:44px;margin-top:12px;pointer-events:auto;font-size:26px;box-shadow:0 3px 12px #00000047}
.product-dialog{max-height:calc(100dvh - max(env(safe-area-inset-top),16px) - 48px)}
}
@media(max-width:650px){.detail-3d-badge{right:auto;left:10px}}
/* ======================= From print to pitch: 1 UV print, 2 apply on gear, 3 box print & fold =======================
Scenes are built by process.js. Everything moves with CSS keyframes (transform / opacity / clip-path only).
Without .pv-run (before the section is seen, or with reduced motion) each panel shows a finished still. */
.pv-sprite{position:absolute;width:0;height:0;overflow:hidden}
.process{padding:46px 0 14px}
.process-lead{max-width:340px;margin:0;color:var(--muted);font-size:15px;line-height:1.6}
.process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.pv-card{position:relative;display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:20px;background:#ffffff}
.pv-stage{position:relative;aspect-ratio:340/292;overflow:hidden;border-radius:19px 19px 0 0;container-type:inline-size;--u:1px;--u:calc(100cqw / 340);background:radial-gradient(85% 65% at 50% 40%,#4a1017 0%,#251b1c 56%,#141011 100%);isolation:isolate}
.pv-art{position:absolute;left:0;top:0;display:block;width:100%;height:auto;overflow:hidden}
.pv-scene{position:absolute;inset:0}
.pv-copy{padding:18px 20px 22px}
.pv-num{display:inline-block;margin-bottom:8px;color:#922a33;font:italic 800 14px/1 'Barlow Condensed','DM Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase}
.pv-copy h3{margin-bottom:8px;font-size:18px}
.pv-copy p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.65}
html[data-theme=dark] .pv-card{border-color:#342c29;background:#191617}
html[data-theme=dark] .pv-num{color:#e0969c}
.pv-card:not(:last-child)::after{content:'';position:absolute;z-index:3;top:0;right:-27px;width:28px;height:28px;margin-top:calc(42.94% - 14px);border-radius:50%;background:#1a1516 url("data:image/svg+xml;utf8,") center/14px no-repeat;box-shadow:0 0 0 4px #ffffff}
html[data-theme=dark] .pv-card:not(:last-child)::after{box-shadow:0 0 0 4px #121010}
@media(max-width:1000px){
.process-grid{grid-template-columns:minmax(0,1fr);gap:30px}
.pv-card{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center}
.pv-stage{border-radius:19px 0 0 19px}
.pv-copy{padding:20px 24px}
.pv-card:not(:last-child)::after{top:auto;right:auto;bottom:-30px;left:calc(26.7% - 14px);margin:0;transform:rotate(90deg)}
}
@media(max-width:650px){
.process{padding:34px 0 8px}
.process-lead{margin-top:10px}
.pv-card{display:flex;align-items:stretch}
.pv-stage{border-radius:19px 19px 0 0}
.pv-copy{padding:16px 18px 20px}
.pv-card:not(:last-child)::after{left:calc(50% - 14px)}
}
/* step tracker inside each stage (sizes follow the stage width through --u) */
.pv-track{position:absolute;left:0;right:0;bottom:calc(9*var(--u));display:flex;justify-content:center;gap:calc(5*var(--u));margin:0;padding:0;list-style:none}
.pv-track li{display:flex;align-items:center;gap:calc(5*var(--u));padding:calc(4*var(--u)) calc(9*var(--u)) calc(4*var(--u)) calc(4*var(--u));border:1px solid #ead7b655;border-radius:999px;background:#ffffff0d;color:#ead7b6;font:700 calc(11*var(--u))/1 'DM Sans',sans-serif;white-space:nowrap}
.pv-track i{position:relative;display:grid;place-items:center;width:calc(17*var(--u));height:calc(17*var(--u));border-radius:50%;background:#35d07f;color:#0d2a1a;font-size:calc(10*var(--u));font-style:normal}
.pv-track i::after{content:'\2713';position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;background:#35d07f;color:#0d2a1a;font-weight:800}
.pv-track li:last-child{border-color:#ead7b6;background:#ead7b6;color:#1a1516}
.pv-track li:last-child i{background:#1a1516;color:#ead7b6}
.pv-track li:last-child i::after{opacity:0}
/* 1. UV print run (finished still: printed sticker lifted on the bed) */
.pv-card-print .pv-d2,.pv-card-print .pv-d3,.pv-card-print .pv-d4{opacity:0}
.pv-cover{transform:translateY(140px)}
.pv-gantry{transform:translateY(16px)}
.pv-lift{transform:translateY(-6px) scale(1.04);transform-box:fill-box;transform-origin:center}
.pv-lamp{opacity:.12}.pv-lampbar{opacity:.35}.pv-cureband{opacity:0}
/* 2. apply (finished still: sticker on the bat, film gone) */
.pv-card-apply .pv-s2,.pv-card-apply .pv-s3,.pv-card-apply .pv-s4{opacity:0}
.pv-land,.pv-liner,.pv-landsh{transform-box:fill-box;transform-origin:center}
.pv-liner,.pv-landsh,.pv-filmrest,.pv-flap,.pv-curl,.pv-sq{opacity:0}
.pv-filmrest,.pv-haze,.pv-flapin{transform-box:fill-box;transform-origin:100% 50%}
.pv-haze{transform:scaleX(0)}
/* 3. box print & fold (finished still: folded Redline box) */
.pv-box{position:absolute;left:0;top:0;width:100%;height:calc(250*var(--u));perspective:calc(900*var(--u));perspective-origin:50% 38%}
.bxn{--W:calc(104*var(--u));--H:calc(64*var(--u));--D:calc(52*var(--u));position:absolute;left:calc(14*var(--u));top:calc(38*var(--u));width:calc(312*var(--u));height:calc(168*var(--u));transform-style:preserve-3d;transform-origin:calc(104*var(--u)) calc(84*var(--u)) calc(-26*var(--u));transform:translateX(calc(52*var(--u))) rotateX(-20deg) rotateY(-30deg) scale(1.3)}
.bxf{position:absolute;transform-style:preserve-3d;background:#ebe8e3;box-shadow:inset 0 0 0 1px #0000002e}
.bxa{position:absolute;inset:0;background-size:100% 100%;background-repeat:no-repeat}
.bx-front{left:var(--D);top:var(--D);width:var(--W);height:var(--H)}
.bx-back{left:100%;top:0;width:var(--W);height:var(--H);transform-origin:0 50%;transform:rotateY(90deg)}
.bx-top{left:var(--D);top:0;width:var(--W);height:var(--D);transform-origin:50% 100%;transform:rotateX(90deg)}
.bx-bottom{left:var(--D);top:calc(var(--D) + var(--H));width:var(--W);height:var(--D);transform-origin:50% 0;transform:rotateX(-90deg)}
.bx-left{left:0;top:var(--D);width:var(--D);height:var(--H);transform-origin:100% 50%;transform:rotateY(-90deg)}
.bx-right{left:calc(var(--D) + var(--W));top:var(--D);width:var(--D);height:var(--H);transform-origin:0 50%;transform:rotateY(90deg)}
.bx-front>.bxa,.bx-back>.bxa{background-image:url('assets/box-redline-front.webp')}
.bx-left>.bxa,.bx-right>.bxa{background-image:linear-gradient(#00000033,#00000033),url('assets/box-redline-side.webp')}
.bx-top>.bxa{background:linear-gradient(135deg,#221f24 0 58%,#a0121c 58% 62%,#221f24 62% 67%,#a0121c 67% 69%,#221f24 69%)}
.bx-bottom>.bxa{background:#141216}
.bx-head{position:absolute;left:calc(-8*var(--u));right:calc(-8*var(--u));top:calc(-5*var(--u));height:calc(10*var(--u));border-radius:calc(4*var(--u));background:linear-gradient(#625b5c,#2b2526);box-shadow:0 0 calc(14*var(--u)) calc(3*var(--u)) #9b5cff99;opacity:0;transform:translateZ(calc(6*var(--u)))}
.bx-floor{position:absolute;left:50%;top:calc(196*var(--u));width:calc(230*var(--u));height:calc(28*var(--u));margin-left:calc(-115*var(--u));border-radius:50%;background:radial-gradient(closest-side,#000000b3,transparent)}
/* ---- motion (only once the section has been seen) ---- */
.pv-run .pv-card-print .pv-d1{animation:pvVisQ1 24s steps(1,end) infinite both}
.pv-run .pv-card-print .pv-d2{animation:pvVisQ2 24s steps(1,end) infinite both}
.pv-run .pv-card-print .pv-d3{animation:pvVisQ3 24s steps(1,end) infinite both}
.pv-run .pv-card-print .pv-d4{animation:pvVisQ4 24s steps(1,end) infinite both}
.pv-run .pv-pfilm{animation:pvPFilm 6s infinite both}
.pv-run .pv-cover{animation:pvCover 6s linear infinite both}
.pv-run .pv-gantry{animation:pvGantry 6s infinite both}
.pv-run .pv-carriage{animation:pvCarr 6s ease-in-out infinite both}
.pv-run .pv-lamp{animation:pvLamp 6s linear infinite both}
.pv-run .pv-lampbar{animation:pvLampBar 6s linear infinite both}
.pv-run .pv-cureband{animation:pvCure 6s linear infinite both}
.pv-run .pv-led{animation:pvLed 6s steps(1,end) infinite both}
.pv-run .pv-lift{animation:pvLift 6s cubic-bezier(.2,.7,.25,1) infinite both}
.pv-run .pv-lift-sh{animation:pvLiftSh 6s linear infinite both}
.pv-run .pv-shine-p{animation:pvShine 6s ease-in-out infinite both}
.pv-run .pv-card-apply .pv-s1{animation:pvVisF1 24s linear -19.1s infinite both}
.pv-run .pv-card-apply .pv-s2{animation:pvVisF2 24s linear -19.1s infinite both}
.pv-run .pv-card-apply .pv-s3{animation:pvVisF3 24s linear -19.1s infinite both}
.pv-run .pv-card-apply .pv-s4{animation:pvVisF4 24s linear -19.1s infinite both}
.pv-run .pv-land{animation:pvLand 6s -19.1s infinite both}
.pv-run .pv-liner{animation:pvLiner 6s ease-in -19.1s infinite both}
.pv-run .pv-landsh{animation:pvLandSh 6s ease-in-out -19.1s infinite both}
.pv-run .pv-sq{animation:pvSq2 6s ease-in-out -19.1s infinite both}
.pv-run .pv-haze{animation:pvHaze 6s ease-in-out -19.1s infinite both}
.pv-run .pv-b1{animation:pvBubA1 6s linear -19.1s infinite both}
.pv-run .pv-b2{animation:pvBubA2 6s linear -19.1s infinite both}
.pv-run .pv-b3{animation:pvBubA3 6s linear -19.1s infinite both}
.pv-run .pv-filmrest{animation:pvRest 6s cubic-bezier(.45,0,.4,1) -19.1s infinite both}
.pv-run .pv-curl{animation:pvCurl2 6s cubic-bezier(.45,0,.4,1) -19.1s infinite both}
.pv-run .pv-flap{animation:pvFlap 6s cubic-bezier(.45,0,.4,1) -19.1s infinite both}
.pv-run .pv-flapin{animation:pvFlapIn 6s ease-out -19.1s infinite both}
.pv-run .pv-shine-a{animation:pvShineA2 6s ease-in-out -19.1s infinite both}
.pv-run .bxn{animation:pvNet 7.5s infinite both}
.pv-run .bx-top{animation:pvTop 7.5s cubic-bezier(.45,0,.25,1) infinite both}
.pv-run .bx-bottom{animation:pvBottom 7.5s cubic-bezier(.45,0,.25,1) infinite both}
.pv-run .bx-left{animation:pvLeft 7.5s cubic-bezier(.45,0,.25,1) infinite both}
.pv-run .bx-right,.pv-run .bx-back{animation:pvRight 7.5s cubic-bezier(.45,0,.25,1) infinite both}
.pv-run .bx-top>.bxa{animation:pvArtA 7.5s linear infinite both}
.pv-run .bx-front>.bxa,.pv-run .bx-left>.bxa,.pv-run .bx-right>.bxa,.pv-run .bx-back>.bxa{animation:pvArtB 7.5s linear infinite both}
.pv-run .bx-bottom>.bxa{animation:pvArtC 7.5s linear infinite both}
.pv-run .bx-head{animation:pvHead 7.5s linear infinite both}
.pv-run .bx-floor{animation:pvFloor 7.5s linear infinite both}
.pv-paused .pv-stage *,.pv-paused .pv-stage *::after{animation-play-state:paused!important}
@keyframes pvVisP1{0%{opacity:1}33.33%,100%{opacity:0}}
@keyframes pvVisP2{0%{opacity:0}33.33%{opacity:1}66.67%,100%{opacity:0}}
@keyframes pvVisP3{0%,33.33%{opacity:0}66.67%,100%{opacity:1}}
@keyframes pvVis1{0%,31.11%{opacity:1}33.33%,97.78%{opacity:0}100%{opacity:1}}
@keyframes pvVis2{0%,31.11%{opacity:0}33.33%,64.44%{opacity:1}66.67%,100%{opacity:0}}
@keyframes pvVis3{0%,64.44%{opacity:0}66.67%,97.78%{opacity:1}100%{opacity:0}}
@keyframes pvPFilm{0%{transform:translateX(-270px);opacity:1;animation-timing-function:cubic-bezier(.2,.7,.25,1)}16.67%{transform:translateX(0);opacity:1}88.33%{transform:translateX(0);opacity:1;animation-timing-function:cubic-bezier(.55,0,.75,.45)}100%{transform:translateX(270px);opacity:.3}}
@keyframes pvCover{0%,20%{transform:translateY(0)}56.67%,100%{transform:translateY(140px)}}
@keyframes pvGantry{0%,16.67%{transform:translateY(16px);animation-timing-function:ease-in-out}20%{transform:translateY(59px);animation-timing-function:linear}56.67%{transform:translateY(189px);animation-timing-function:ease-in-out}68.33%{transform:translateY(59px);animation-timing-function:ease-in-out}71.67%,100%{transform:translateY(16px)}}
@keyframes pvCarr{0%,20%{transform:translateX(0)}23.06%{transform:translateX(-72px)}29.17%{transform:translateX(72px)}35.28%{transform:translateX(-72px)}41.39%{transform:translateX(72px)}47.5%{transform:translateX(-72px)}53.61%{transform:translateX(72px)}56.67%,100%{transform:translateX(0)}}
@keyframes pvLamp{0%,19.9%{opacity:.12}20%,56.6%{opacity:.6}56.67%,68.33%{opacity:1}68.4%,100%{opacity:.12}}
@keyframes pvLampBar{0%,19.9%{opacity:.35}20%,56.6%{opacity:.8}56.67%,68.33%{opacity:1}68.4%,100%{opacity:.35}}
@keyframes pvCure{0%,56.67%{opacity:0}58.5%,67%{opacity:.85}70%,100%{opacity:0}}
@keyframes pvLed{0%{fill:#ffb02e}20%{fill:#2ee6ff}56.67%{fill:#b98cff}71.67%,100%{fill:#35d07f}}
@keyframes pvLift{0%,71.67%{transform:none}78.33%,100%{transform:translateY(-6px) scale(1.04)}}
@keyframes pvLiftSh{0%,71.67%{opacity:0}78.33%,100%{opacity:1}}
@keyframes pvShine{0%,76.67%{transform:translateX(0)}88.33%,100%{transform:translateX(var(--shd))}}
@keyframes pvNet{0%,30.67%{transform:translateX(0) rotateX(26deg) rotateY(0deg) scale(1);animation-timing-function:cubic-bezier(.45,0,.25,1)}49.33%{transform:translateX(calc(52*var(--u))) rotateX(-20deg) rotateY(-30deg) scale(1.3);animation-timing-function:cubic-bezier(.45,0,.55,1)}81.33%{transform:translateX(calc(52*var(--u))) rotateX(-20deg) rotateY(330deg) scale(1.3)}81.34%{transform:translateX(calc(52*var(--u))) rotateX(-20deg) rotateY(-30deg) scale(1.3);animation-timing-function:cubic-bezier(.45,0,.25,1)}94.67%,100%{transform:translateX(0) rotateX(26deg) rotateY(0deg) scale(1)}}
@keyframes pvTop{0%,30.67%{transform:rotateX(0deg)}49.33%,81.34%{transform:rotateX(90deg)}94.67%,100%{transform:rotateX(0deg)}}
@keyframes pvBottom{0%,30.67%{transform:rotateX(0deg)}49.33%,81.34%{transform:rotateX(-90deg)}94.67%,100%{transform:rotateX(0deg)}}
@keyframes pvLeft{0%,30.67%{transform:rotateY(0deg)}49.33%,81.34%{transform:rotateY(-90deg)}94.67%,100%{transform:rotateY(0deg)}}
@keyframes pvRight{0%,30.67%{transform:rotateY(0deg)}49.33%,81.34%{transform:rotateY(90deg)}94.67%,100%{transform:rotateY(0deg)}}
@keyframes pvArtA{0%{clip-path:inset(0 0 100% 0)}9.49%,94.67%{clip-path:inset(0 0 0 0)}94.7%,100%{clip-path:inset(0 0 100% 0)}}
@keyframes pvArtB{0%,9.49%{clip-path:inset(0 0 100% 0)}21.15%,94.67%{clip-path:inset(0 0 0 0)}94.7%,100%{clip-path:inset(0 0 100% 0)}}
@keyframes pvArtC{0%,21.15%{clip-path:inset(0 0 100% 0)}30.67%,94.67%{clip-path:inset(0 0 0 0)}94.7%,100%{clip-path:inset(0 0 100% 0)}}
@keyframes pvHead{0%{opacity:1;transform:translateZ(calc(6*var(--u))) translateY(0)}30.67%{opacity:1;transform:translateZ(calc(6*var(--u))) translateY(calc(168*var(--u)))}32%,100%{opacity:0;transform:translateZ(calc(6*var(--u))) translateY(calc(168*var(--u)))}}
@keyframes pvFloor{0%,30.67%{opacity:0}49.33%,81.34%{opacity:1}94.67%,100%{opacity:0}}
@keyframes pvTprint1{0%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}20%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}100%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}}
@keyframes pvTprint1i{0%{background-color:#1a1516;color:#ead7b6}20%{background-color:#35d07f;color:#0d2a1a}100%{background-color:#35d07f;color:#0d2a1a}}
@keyframes pvTprint1c{0%{opacity:0}20%{opacity:1}100%{opacity:1}}
@keyframes pvTprint2{0%{border-color:#ffffff1a;background-color:#ffffff0d;color:#bdb4b1}20%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}56.67%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}100%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}}
@keyframes pvTprint2i{0%{background-color:#ffffff1f;color:#f1e5d0}20%{background-color:#1a1516;color:#ead7b6}56.67%{background-color:#35d07f;color:#0d2a1a}100%{background-color:#35d07f;color:#0d2a1a}}
@keyframes pvTprint2c{0%{opacity:0}20%{opacity:0}56.67%{opacity:1}100%{opacity:1}}
@keyframes pvTprint3{0%{border-color:#ffffff1a;background-color:#ffffff0d;color:#bdb4b1}56.67%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}71.67%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}100%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}}
@keyframes pvTprint3i{0%{background-color:#ffffff1f;color:#f1e5d0}56.67%{background-color:#1a1516;color:#ead7b6}71.67%{background-color:#35d07f;color:#0d2a1a}100%{background-color:#35d07f;color:#0d2a1a}}
@keyframes pvTprint3c{0%{opacity:0}56.67%{opacity:0}71.67%{opacity:1}100%{opacity:1}}
@keyframes pvTprint4{0%{border-color:#ffffff1a;background-color:#ffffff0d;color:#bdb4b1}71.67%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}100%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}}
@keyframes pvTprint4i{0%{background-color:#ffffff1f;color:#f1e5d0}71.67%{background-color:#1a1516;color:#ead7b6}100%{background-color:#1a1516;color:#ead7b6}}
@keyframes pvTprint4c{0%{opacity:0}71.67%{opacity:0}100%{opacity:0}}
@keyframes pvTapply1{0%{border-color:#ffffff1a;background-color:#ffffff0d;color:#bdb4b1}5%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}25%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}100%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}}
@keyframes pvTapply1i{0%{background-color:#ffffff1f;color:#f1e5d0}5%{background-color:#1a1516;color:#ead7b6}25%{background-color:#35d07f;color:#0d2a1a}100%{background-color:#35d07f;color:#0d2a1a}}
@keyframes pvTapply1c{0%{opacity:0}5%{opacity:0}25%{opacity:1}100%{opacity:1}}
@keyframes pvTapply2{0%{border-color:#ffffff1a;background-color:#ffffff0d;color:#bdb4b1}25%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}48.33%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}100%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}}
@keyframes pvTapply2i{0%{background-color:#ffffff1f;color:#f1e5d0}25%{background-color:#1a1516;color:#ead7b6}48.33%{background-color:#35d07f;color:#0d2a1a}100%{background-color:#35d07f;color:#0d2a1a}}
@keyframes pvTapply2c{0%{opacity:0}25%{opacity:0}48.33%{opacity:1}100%{opacity:1}}
@keyframes pvTapply3{0%{border-color:#ffffff1a;background-color:#ffffff0d;color:#bdb4b1}48.33%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}70%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}100%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}}
@keyframes pvTapply3i{0%{background-color:#ffffff1f;color:#f1e5d0}48.33%{background-color:#1a1516;color:#ead7b6}70%{background-color:#35d07f;color:#0d2a1a}100%{background-color:#35d07f;color:#0d2a1a}}
@keyframes pvTapply3c{0%{opacity:0}48.33%{opacity:0}70%{opacity:1}100%{opacity:1}}
@keyframes pvTapply4{0%{border-color:#ffffff1a;background-color:#ffffff0d;color:#bdb4b1}70%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}100%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}}
@keyframes pvTapply4i{0%{background-color:#ffffff1f;color:#f1e5d0}70%{background-color:#1a1516;color:#ead7b6}100%{background-color:#1a1516;color:#ead7b6}}
@keyframes pvTapply4c{0%{opacity:0}70%{opacity:0}100%{opacity:0}}
@keyframes pvTpack1{0%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}30.67%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}100%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}}
@keyframes pvTpack1i{0%{background-color:#1a1516;color:#ead7b6}30.67%{background-color:#35d07f;color:#0d2a1a}100%{background-color:#35d07f;color:#0d2a1a}}
@keyframes pvTpack1c{0%{opacity:0}30.67%{opacity:1}100%{opacity:1}}
@keyframes pvTpack2{0%{border-color:#ffffff1a;background-color:#ffffff0d;color:#bdb4b1}30.67%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}49.33%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}100%{border-color:#ead7b655;background-color:#ffffff0d;color:#ead7b6}}
@keyframes pvTpack2i{0%{background-color:#ffffff1f;color:#f1e5d0}30.67%{background-color:#1a1516;color:#ead7b6}49.33%{background-color:#35d07f;color:#0d2a1a}100%{background-color:#35d07f;color:#0d2a1a}}
@keyframes pvTpack2c{0%{opacity:0}30.67%{opacity:0}49.33%{opacity:1}100%{opacity:1}}
@keyframes pvTpack3{0%{border-color:#ffffff1a;background-color:#ffffff0d;color:#bdb4b1}49.33%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}100%{border-color:#ead7b6;background-color:#ead7b6;color:#1a1516}}
@keyframes pvTpack3i{0%{background-color:#ffffff1f;color:#f1e5d0}49.33%{background-color:#1a1516;color:#ead7b6}100%{background-color:#1a1516;color:#ead7b6}}
@keyframes pvTpack3c{0%{opacity:0}49.33%{opacity:0}100%{opacity:0}}
.pv-run .pv-card-print .pv-t1{animation:pvTprint1 6s steps(1,end) 0s infinite both}.pv-run .pv-card-print .pv-t1 i{animation:pvTprint1i 6s steps(1,end) 0s infinite both}.pv-run .pv-card-print .pv-t1 i::after{animation:pvTprint1c 6s steps(1,end) 0s infinite both}
.pv-run .pv-card-print .pv-t2{animation:pvTprint2 6s steps(1,end) 0s infinite both}.pv-run .pv-card-print .pv-t2 i{animation:pvTprint2i 6s steps(1,end) 0s infinite both}.pv-run .pv-card-print .pv-t2 i::after{animation:pvTprint2c 6s steps(1,end) 0s infinite both}
.pv-run .pv-card-print .pv-t3{animation:pvTprint3 6s steps(1,end) 0s infinite both}.pv-run .pv-card-print .pv-t3 i{animation:pvTprint3i 6s steps(1,end) 0s infinite both}.pv-run .pv-card-print .pv-t3 i::after{animation:pvTprint3c 6s steps(1,end) 0s infinite both}
.pv-run .pv-card-print .pv-t4{animation:pvTprint4 6s steps(1,end) 0s infinite both}.pv-run .pv-card-print .pv-t4 i{animation:pvTprint4i 6s steps(1,end) 0s infinite both}.pv-run .pv-card-print .pv-t4 i::after{animation:pvTprint4c 6s steps(1,end) 0s infinite both}
.pv-run .pv-card-apply .pv-t1{animation:pvTapply1 6s steps(1,end) -19.1s infinite both}.pv-run .pv-card-apply .pv-t1 i{animation:pvTapply1i 6s steps(1,end) -19.1s infinite both}.pv-run .pv-card-apply .pv-t1 i::after{animation:pvTapply1c 6s steps(1,end) -19.1s infinite both}
.pv-run .pv-card-apply .pv-t2{animation:pvTapply2 6s steps(1,end) -19.1s infinite both}.pv-run .pv-card-apply .pv-t2 i{animation:pvTapply2i 6s steps(1,end) -19.1s infinite both}.pv-run .pv-card-apply .pv-t2 i::after{animation:pvTapply2c 6s steps(1,end) -19.1s infinite both}
.pv-run .pv-card-apply .pv-t3{animation:pvTapply3 6s steps(1,end) -19.1s infinite both}.pv-run .pv-card-apply .pv-t3 i{animation:pvTapply3i 6s steps(1,end) -19.1s infinite both}.pv-run .pv-card-apply .pv-t3 i::after{animation:pvTapply3c 6s steps(1,end) -19.1s infinite both}
.pv-run .pv-card-apply .pv-t4{animation:pvTapply4 6s steps(1,end) -19.1s infinite both}.pv-run .pv-card-apply .pv-t4 i{animation:pvTapply4i 6s steps(1,end) -19.1s infinite both}.pv-run .pv-card-apply .pv-t4 i::after{animation:pvTapply4c 6s steps(1,end) -19.1s infinite both}
.pv-run .pv-card-pack .pv-t1{animation:pvTpack1 7.5s steps(1,end) 0s infinite both}.pv-run .pv-card-pack .pv-t1 i{animation:pvTpack1i 7.5s steps(1,end) 0s infinite both}.pv-run .pv-card-pack .pv-t1 i::after{animation:pvTpack1c 7.5s steps(1,end) 0s infinite both}
.pv-run .pv-card-pack .pv-t2{animation:pvTpack2 7.5s steps(1,end) 0s infinite both}.pv-run .pv-card-pack .pv-t2 i{animation:pvTpack2i 7.5s steps(1,end) 0s infinite both}.pv-run .pv-card-pack .pv-t2 i::after{animation:pvTpack2c 7.5s steps(1,end) 0s infinite both}
.pv-run .pv-card-pack .pv-t3{animation:pvTpack3 7.5s steps(1,end) 0s infinite both}.pv-run .pv-card-pack .pv-t3 i{animation:pvTpack3i 7.5s steps(1,end) 0s infinite both}.pv-run .pv-card-pack .pv-t3 i::after{animation:pvTpack3c 7.5s steps(1,end) 0s infinite both}
/* ---- Phones: the process panels move into a full-screen "How it works" view, opened from a tab ---- */
.pv-open{display:none}
.pv-paused .pv-card *,.pv-paused .pv-card *::after{animation-play-state:paused!important}
@media(max-width:650px){
.process{padding:22px 0 4px}
.process>.section-heading,.process>.process-grid{display:none}
.pv-open{position:relative;display:flex;align-items:center;gap:14px;width:100%;min-height:88px;padding:16px 14px;overflow:hidden;isolation:isolate;border:1px solid #ffffff1a;border-radius:20px;background:radial-gradient(90% 150% at 0% 50%,#7a121b 0%,#3a0b10 42%,#1a1314 78%);color:#ffffff;font:inherit;text-align:left;box-shadow:0 18px 34px -20px #3a070bcc;cursor:pointer}
.pv-open::before{content:'';position:absolute;z-index:-1;top:-64px;right:-80px;width:210px;height:210px;background:url("data:image/svg+xml;utf8,") center/contain no-repeat;opacity:.55}
.pv-open-play{position:relative;flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#ead7b6;color:#1a1516;box-shadow:0 8px 18px -8px #000000}
.pv-open-play svg{margin-left:3px}
.pv-open-play::after{content:'';position:absolute;inset:-6px;border:2px solid #ead7b6;border-radius:50%;opacity:0;animation:pvPulse 2.2s ease-out infinite}
.pv-open-text{display:flex;flex:1;flex-direction:column;gap:6px;min-width:0}
.pv-open-text b{font-size:17px;font-weight:750;line-height:1.2}
.pv-open-steps{display:flex;align-items:center;gap:6px;color:#ead7b6;font-size:12.5px;font-weight:650}
.pv-open-steps i{font-style:normal}
.pv-open-steps i+i::before{content:'\2192';margin-right:6px;opacity:.7}
.pv-open-go{flex:none;color:#ead7b6}
}
@keyframes pvPulse{0%{opacity:.7;transform:scale(.9)}100%{opacity:0;transform:scale(1.35)}}
@media(prefers-reduced-motion:reduce){.pv-open-play::after{animation:none}}
.pv-sheet{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;overflow:hidden;border:0;border-radius:0;background:radial-gradient(120% 60% at 50% 0%,#3d0d13 0%,#171213 58%,#0f0c0d 100%);color:#ffffff;overscroll-behavior:contain}
.pv-sheet::backdrop{background:#0f0c0d}
.pv-sheet[open]{animation:pvSheetIn .38s cubic-bezier(.2,.7,.25,1)}
@keyframes pvSheetIn{from{opacity:0;transform:translateY(26px)}}
html.pv-lock,html.pv-lock body{overflow:hidden}
.pv-sheet-in{display:flex;flex-direction:column;gap:12px;height:100%;padding:max(12px,env(safe-area-inset-top)) 14px max(12px,env(safe-area-inset-bottom))}
.pv-sheet-head{display:flex;flex:none;align-items:center;gap:8px;padding:2px 0 0 2px}
.pv-sheet-head>div{flex:1;min-width:0}
.pv-sheet-eyebrow{display:block;color:#ead7b6;font-size:10.5px;font-weight:700;letter-spacing:1.2px}
.pv-sheet-head h2{margin:2px 0 0;outline:none;color:#ffffff;font-size:21px;line-height:1.15;letter-spacing:-.4px}
.pv-sheet-close{flex:none;display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid #ffffff2e;border-radius:50%;background:#ffffff12;color:#ffffff;font-size:24px;line-height:1}
/* story progress: one bar per step, the current one fills while it plays */
.pv-bars{display:grid;flex:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.pv-bar{display:flex;flex-direction:column;gap:6px;min-height:30px;padding:4px 0 0;border:0;background:none;color:#ffffff73;font:700 11px/1 var(--font);letter-spacing:.3px;text-align:left;cursor:pointer}
.pv-bar i{position:relative;display:block;height:3px;overflow:hidden;border-radius:2px;background:#ffffff2e}
.pv-bar i::before{content:'';position:absolute;inset:0;border-radius:2px;background:#ead7b6;transform:scaleX(0);transform-origin:left}
.pv-bar.done i::before{transform:scaleX(1)}
.pv-bar.on{color:#ead7b6}
.pv-bar.on i::before{animation:pvBar var(--dur,6s) linear var(--boff,0s) forwards}
.pv-bar.done{color:#ffffffb3}
@keyframes pvBar{to{transform:scaleX(1)}}
/* one big step at a time; the next slides in with a little depth and a light sweep */
.pv-slides{position:relative;flex:1;min-height:0;margin:0 -10px;perspective:1200px;touch-action:pan-y}
.pv-slide{position:absolute;inset:0;visibility:hidden;opacity:0;transform:translateX(38%) scale(.88) rotateY(-16deg);transition:transform .8s cubic-bezier(.2,.75,.2,1),opacity .5s ease,visibility 0s .8s}
.pv-slide.is-past{transform:translateX(-38%) scale(.88) rotateY(16deg)}
.pv-slide.is-on{visibility:visible;opacity:1;transform:none;transition:transform .8s cubic-bezier(.2,.75,.2,1),opacity .6s ease .12s,visibility 0s}
.pv-slides::after{content:'';position:absolute;z-index:5;top:-4%;bottom:-4%;left:0;width:40%;background:linear-gradient(100deg,transparent,#ead7b62e 40%,#fff5e659 50%,#ead7b62e 60%,transparent);opacity:0;pointer-events:none;transform:translateX(-120%) skewX(-12deg)}
.pv-slides.pv-wipe::after{animation:pvWipe .9s cubic-bezier(.3,.6,.3,1)}
@keyframes pvWipe{0%{opacity:0;transform:translateX(-120%) skewX(-12deg)}25%{opacity:1}100%{opacity:0;transform:translateX(330%) skewX(-12deg)}}
.pv-sheet .pv-slide .pv-card{display:flex;flex-direction:column;gap:12px;height:100%;padding:0;border:0;border-radius:0;background:none}
.pv-sheet .pv-slide .pv-card::after{display:none}
.pv-slide-art{display:grid;flex:1;place-items:center;min-height:0;container-type:size}
.pv-sheet .pv-stage.pv-stage-story{width:min(100cqw,calc(100cqh * 340 / 292));height:auto;aspect-ratio:340/292;border:1px solid #ffffff17;border-radius:20px;box-shadow:0 26px 50px -24px #000000}
.pv-slide-head{flex:none;padding:2px 14px 0}
.pv-slide-head h3{margin:0;color:#ffffff;font-size:22px;line-height:1.2;letter-spacing:-.3px}
.pv-slide-copy{flex:none;padding:0 14px}
.pv-sheet .pv-slide .pv-num{margin-bottom:5px;color:#ead7b6;font-size:15px}
.pv-slide-copy p{margin:0;color:#d9d2cf;font-size:14.5px;line-height:1.55}
.pv-chips{display:flex;gap:6px;margin-top:10px}
.pv-chip{min-height:34px;padding:0 14px;border:1px solid #ead7b666;border-radius:999px;background:transparent;color:#ead7b6;font:700 12.5px/1 var(--font);cursor:pointer;-webkit-tap-highlight-color:transparent}
.pv-chip:active{transform:scale(.96)}
.pv-chip:focus-visible{outline:2px solid #ead7b6;outline-offset:2px}
.pv-sheet .pv-run .pv-c1{animation:pvChipF1 24s steps(1,end) infinite both}
.pv-sheet .pv-run .pv-c2{animation:pvChipF2 24s steps(1,end) infinite both}
.pv-sheet .pv-run .pv-c3{animation:pvChipF3 24s steps(1,end) infinite both}
.pv-sheet .pv-run .pv-c4{animation:pvChipF4 24s steps(1,end) infinite both}
@keyframes pvChip1{0%{background-color:#ead7b6;color:#1a1516}33.33%,100%{background-color:transparent;color:#ead7b6}}
@keyframes pvChip2{0%{background-color:transparent;color:#ead7b6}33.33%{background-color:#ead7b6;color:#1a1516}66.67%,100%{background-color:transparent;color:#ead7b6}}
@keyframes pvChip3{0%,33.33%{background-color:transparent;color:#ead7b6}66.67%,100%{background-color:#ead7b6;color:#1a1516}}
/* in the story each step starts from its own beginning (the Apply step goes bat, helmet, pads) */
.pv-sheet .pv-run .pv-card-apply *,.pv-sheet .pv-run .pv-card-apply *::after{animation-delay:var(--off,0s)!important}
.pv-paused .pv-bar.on i::before{animation-play-state:paused}
.pv-story-nav{display:flex;flex:none;align-items:center;gap:10px}
.pv-prev,.pv-next{flex:none;display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid #ffffff2e;border-radius:50%;background:#ffffff12;color:#ead7b6}
.pv-sheet-quote{flex:1;min-height:48px;padding:0 18px;border:0;border-radius:999px;background:#ead7b6;color:#1a1516;font:700 15px/1 var(--font)}
@media(prefers-reduced-motion:reduce){.pv-slide,.pv-slide.is-on{transition:none}.pv-slides::after{display:none}}
/* four slots of 6 s: printer designs, apply scenes (bat, helmet, pads + glove, laptop + tumbler) and their chips */
@keyframes pvVisQ1{0%{opacity:1}25%,100%{opacity:0}}
@keyframes pvVisQ2{0%{opacity:0}25%{opacity:1}50%,100%{opacity:0}}
@keyframes pvVisQ3{0%{opacity:0}50%{opacity:1}75%,100%{opacity:0}}
@keyframes pvVisQ4{0%{opacity:0}75%,100%{opacity:1}}
@keyframes pvVisF1{0%{opacity:0}1.67%,23.33%{opacity:1}25%,100%{opacity:0}}
@keyframes pvVisF2{0%,25%{opacity:0}26.67%,48.33%{opacity:1}50%,100%{opacity:0}}
@keyframes pvVisF3{0%,50%{opacity:0}51.67%,73.33%{opacity:1}75%,100%{opacity:0}}
@keyframes pvVisF4{0%,75%{opacity:0}76.67%,98.33%{opacity:1}100%{opacity:0}}
@keyframes pvChipF1{0%{background-color:#ead7b6;color:#1a1516}25%,100%{background-color:transparent;color:#ead7b6}}
@keyframes pvChipF2{0%{background-color:transparent;color:#ead7b6}25%{background-color:#ead7b6;color:#1a1516}50%,100%{background-color:transparent;color:#ead7b6}}
@keyframes pvChipF3{0%{background-color:transparent;color:#ead7b6}50%{background-color:#ead7b6;color:#1a1516}75%,100%{background-color:transparent;color:#ead7b6}}
@keyframes pvChipF4{0%{background-color:transparent;color:#ead7b6}75%,100%{background-color:#ead7b6;color:#1a1516}}
/* apply: backing liner off, film lands, two squeegee passes (bubbles and haze go), slow fold-back peel, sticker shine */
@keyframes pvLand{0%,5%{opacity:0;transform:translate(-8px,-26px) rotate(-3deg) scale(1.1)}8%{opacity:1;transform:translate(-8px,-26px) rotate(-3deg) scale(1.1)}16.67%{opacity:1;transform:translate(-6px,-22px) rotate(-2.4deg) scale(1.09);animation-timing-function:cubic-bezier(.35,0,.2,1)}25%,100%{opacity:1;transform:translate(0,0) rotate(0deg) scale(1)}}
@keyframes pvLiner{0%,10%{opacity:1;transform:translate(0,0) rotate(0deg)}16.67%{opacity:0;transform:translate(0,18px) rotate(2.5deg)}100%{opacity:0;transform:translate(0,18px) rotate(2.5deg)}}
@keyframes pvLandSh{0%,5%{opacity:0;transform:translate(12px,16px) scale(1.12)}8%,16.67%{opacity:.32;transform:translate(12px,16px) scale(1.12)}24%{opacity:.5;transform:translate(1px,2px) scale(1)}25%,100%{opacity:0;transform:translate(0,0) scale(1)}}
@keyframes pvSq2{0%,24%{opacity:0;transform:translate(calc(var(--sq) * -1),0)}25%{opacity:1;transform:translate(calc(var(--sq) * -1),0)}36.67%{opacity:1;transform:translate(var(--sq),0)}48.33%{opacity:1;transform:translate(calc(var(--sq) * -1),2px)}50%,100%{opacity:0;transform:translate(calc(var(--sq) * -1),2px)}}
@keyframes pvHaze{0%,25%{transform:scaleX(1)}36.67%,100%{transform:scaleX(0)}}
@keyframes pvBubA1{0%,28.4%{opacity:1}29.2%,100%{opacity:0}}
@keyframes pvBubA2{0%,30.7%{opacity:1}31.5%,100%{opacity:0}}
@keyframes pvBubA3{0%,33%{opacity:1}33.8%,100%{opacity:0}}
@keyframes pvRest{0%,48.33%{opacity:1;transform:scaleX(1)}66.67%{opacity:1;transform:scaleX(0)}66.7%,100%{opacity:0;transform:scaleX(0)}}
@keyframes pvCurl2{0%,48.3%{opacity:0;transform:translateX(0)}48.33%{opacity:1;transform:translateX(0)}66.67%{opacity:1;transform:translateX(var(--fw))}68.5%,100%{opacity:0;transform:translateX(var(--fw))}}
@keyframes pvFlap{0%,48.3%{opacity:0;transform:translate(0,0)}48.33%{opacity:1;transform:translate(0,0)}66.67%{opacity:1;transform:translate(var(--fw),0)}70%,100%{opacity:0;transform:translate(calc(var(--fw) + 16px),-24px)}}
@keyframes pvFlapIn{0%,48.33%{transform:scaleX(.06)}58%,100%{transform:scaleX(1)}}
@keyframes pvShineA2{0%,73.33%{transform:translateX(0)}88.33%,100%{transform:translateX(var(--shd))}}
/* Phones: the PC trust row and the 4-tick strip are hidden; the "See how it works" tab sits right under the hero */
@media(max-width:650px){
.hero .hero-trust,.surface-strip{display:none!important}
.process{padding:18px 0 2px}
}
.hero-desc,.hero-perks,.hero-seal{display:none}
@media(max-width:650px){
html.m-hero .hero-copy{text-shadow:none}
html.m-hero .hero-copy>p:not(.hero-desc){display:none}
html.m-hero .hero-desc{display:block;max-width:330px;margin:0 0 24px;color:#e6dedb;font-size:15.5px;line-height:1.6}
html.m-hero .hero-actions .button{min-height:50px;border-radius:12px;font-size:15px;font-weight:650}
html.m-hero .hero-actions .hero-quote-btn{order:-1;background:#ead7b6;border-color:#ead7b6;color:#1a1516}
html.m-hero .hero-actions a.button-dark{background:transparent;border:1px solid #ffffff47;color:#ffffff}
.hero-perks li{display:flex;align-items:center;gap:6px}
.hero-perks svg{flex:none;color:#ead7b6}
html.m-hero .hero-bg{opacity:.45}
html.m-hero .hero.page-width{padding-bottom:26px!important}
html.m-hero .hero-actions{flex-direction:column;align-items:stretch;gap:6px}
html.m-hero .hero-actions a.button-dark{min-height:40px;border:0;justify-content:flex-start;padding:0 2px;color:#ead7b6;font-size:14.5px}
html.m-hero .hero-actions a.button-dark::after{content:'\2192';margin-left:8px}
/* seal badge in the corner; the icon trust points in a neat 2 x 2 grid */
html.m-hero .hero-seal{position:absolute;z-index:3;top:16px;right:14px;display:grid;place-items:center;width:96px;height:96px}
html.m-hero .hero-seal svg{position:absolute;inset:0;width:100%;height:100%;animation:heroSealSpin 26s linear infinite}
html.m-hero .hero-seal img{width:48px;height:48px;border-radius:50%;box-shadow:0 0 0 3px #ead7b6,0 6px 16px #00000080}
html.m-hero .hero-copy .eyebrow{max-width:60%}
}
@media(max-width:380px){
html.m-hero .hero-seal{top:12px;right:8px;width:80px;height:80px}
html.m-hero .hero-seal img{width:40px;height:40px}
html.m-hero .hero-perks{font-size:14px;gap:14px 10px}
html.m-hero .hero-perks svg{width:19px;height:19px}
html.m-hero .hero-desc{font-size:16px}
}
@media(max-width:650px){
html.m-hero .hero-perks{display:grid;grid-template-columns:repeat(2,max-content);justify-content:space-between;gap:16px 10px;margin:16px 0 0;padding:18px 0 0;border-top:1px solid #ffffff1f;list-style:none;color:#f3ece9;font-size:15px;font-weight:600}
html.m-hero .hero-perks li{gap:9px}
html.m-hero .hero-perks svg{width:20px;height:20px}
}
@keyframes heroSealSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.hero-seal svg{animation:none!important}}
/* Phones: the first screen runs from the header down to the "See how it works" tab.
process.js measures the header and the tab block and sets --fold-h; the hero stretches to fill it,
the headline and description stay together at the top; everything stays packed together with fixed gaps; any spare height is left at the bottom of the red area. */
@media(max-width:650px){
html.m-hero .hero.page-width{min-height:var(--fold-h,auto);align-items:stretch}
html.m-hero .hero-copy{display:flex;flex-direction:column;align-self:stretch}
html.m-hero .hero-desc{margin:2px 0 22px;max-width:none;color:#f3ece9;font-size:17px;font-weight:500;line-height:1.55;letter-spacing:-.1px;text-wrap:pretty}
html.m-hero .hero-copy{min-width:0}
html.m-hero .hero-actions{margin-bottom:0}
html.m-hero .hero-actions a.button-dark{min-height:40px}
html.m-hero .process{padding:16px 0 16px}
}
/* short phones (e.g. iPhone SE): process.js adds .fold-tight (and .fold-tighter if still needed) so the same content fits */
@media(max-width:650px){
html.fold-tight.m-hero .hero.page-width{padding-top:16px!important;padding-bottom:16px!important}
html.fold-tight.m-hero .hero-copy .eyebrow{max-width:calc(100% - 90px);margin-bottom:8px;font-size:10.5px}
html.fold-tight.m-hero .hero-copy h1,html.fold-tight.m-hero .hero-copy .hero-turn{font-size:37px!important;letter-spacing:-1.4px}
html.fold-tight.m-hero .hero-brand-name{font-size:42px}
html.fold-tight.m-hero .hero-brand{gap:10px}
html.fold-tight.m-hero .hero-swap{margin-bottom:6px}
html.fold-tight.m-hero .hero-desc{margin-bottom:14px;font-size:14.5px;line-height:1.45}
html.fold-tight.m-hero .hero-actions{margin-bottom:12px}
html.fold-tight.m-hero .hero-actions .button{min-height:46px}
html.fold-tight.m-hero .hero-actions a.button-dark{min-height:32px}
html.fold-tight.m-hero .hero-perks{padding-top:12px;gap:10px 10px;font-size:13.5px}
html.fold-tight.m-hero .hero-perks svg{width:18px;height:18px}
html.fold-tight.m-hero .hero-seal{top:10px;right:8px;width:74px;height:74px}
html.fold-tight.m-hero .hero-seal img{width:37px;height:37px}
html.fold-tight.m-hero .process{padding:10px 0 10px}
html.fold-tight.m-hero .pv-open{min-height:70px;padding:11px 12px;gap:12px}
html.fold-tight.m-hero .pv-open-play{width:44px;height:44px}
html.fold-tight.m-hero .pv-open-text b{font-size:15.5px}
html.fold-tighter.m-hero .hero-copy h1,html.fold-tighter.m-hero .hero-copy .hero-turn{font-size:32px!important}
html.fold-tighter.m-hero .hero-brand-name{font-size:36px}
html.fold-tighter.m-hero .hero-desc{font-size:13.5px;margin-bottom:10px}
html.fold-tighter.m-hero .hero-perks{font-size:12.5px}
}
/* Phones: header shows just the Print2Pack wordmark at the left (no DK logo; the seal in the hero carries it) */
@media(max-width:650px){.header .brand-lockup>img{display:none}}
/* Catalogue cards and quote thumbnails use small copies (assets/cards, max 720px); popups and 3D views keep the full-size photos */
.product-photo.photo-bat,.quote-thumb.photo-bat{background-image:url('assets/cards/bat-sticker.webp')!important}
.product-photo.photo-helmet,.quote-thumb.photo-helmet{background-image:url('assets/cards/helmet-3d-front.webp')!important}
.product-photo.photo-pads,.quote-thumb.photo-pads{background-image:url('assets/cards/pads-3d-front.webp')!important}
.product-photo.photo-bag,.quote-thumb.photo-bag{background-image:url('assets/cards/bag-3d-front.webp'),linear-gradient(to bottom,#bfc2cb 16.6%,#d4d6de 83.4%)!important}
.product-photo.photo-jersey,.quote-thumb.photo-jersey{background-image:url('assets/cards/jersey-3d-front.webp'),linear-gradient(to bottom,#d5d8df 16.6%,#f0eef3 83.4%)!important}
.product-photo.photo-ball,.quote-thumb.photo-ball{background-image:url('assets/cards/ball-3d-front.webp'),linear-gradient(to bottom,#eff1f7 16.6%,#ede7ed 83.4%)!important}
.product-photo.photo-bottle,.quote-thumb.photo-bottle{background-image:url('assets/cards/surface-3d-front.webp'),linear-gradient(to bottom,#e8ebf0 16.6%,#f4f3f7 83.4%)!important}
.product-photo.photo-caricature,.quote-thumb.photo-caricature{background-image:url('assets/cards/caricature-3d-front.webp'),linear-gradient(to bottom,#e7ebf3 16.6%,#f5f5f8 83.4%)!important}
.product-photo.photo-patch,.quote-thumb.photo-patch{background-image:url('assets/cards/tpu-3d-front.webp'),linear-gradient(to bottom,#e2e4ea 16.6%,#e4e6ec 83.4%)!important}
.product-photo.photo-trophy,.quote-thumb.photo-trophy{background-image:url('assets/cards/trophy-3d-front.webp'),linear-gradient(to bottom,#e9edf4 16.6%,#f2eff3 83.4%)!important}
.product-photo.photo-medal,.quote-thumb.photo-medal{background-image:url('assets/cards/medal-3d-front.webp'),linear-gradient(to bottom,#e9edf5 16.6%,#f7f5f6 83.4%)!important}
.product-photo.photo-magnet,.quote-thumb.photo-magnet{background-image:url('assets/cards/magnet-3d-front.webp'),linear-gradient(to bottom,#e5e9f1,#f4f5f9)!important}
.product-photo.photo-keychain,.quote-thumb.photo-keychain{background-image:url('assets/cards/keychain-3d-front.webp'),linear-gradient(to bottom,#e7e9ee 16.6%,#e7e8ed 83.4%)!important}
.product-photo.photo-box,.quote-thumb.photo-box{background-image:url('assets/cards/box-3d-front.webp'),linear-gradient(to bottom,#dde4f1 16.6%,#e9ebf2 83.4%)!important}
.product-photo.photo-minibat,.quote-thumb.photo-minibat{background-image:url('assets/cards/minibat.webp')!important}
/* the hero photo sits in a (phones get a 1px placeholder instead of downloading it) */
.hero-media>picture,.zoom-dialog>picture{display:contents}
.footer-copy a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.privacy-note a{color:inherit;text-decoration:underline;text-underline-offset:3px}
/* quote message preview: WhatsApp *bold* headings shown as bold */
.quote-review pre b{color:var(--ink);font-weight:700}
html[data-theme=dark] .quote-review pre b{color:#ffffff}
/* ===== Quote form polish: label + required star / optional tag on one line, typed text in ink, no blue autofill ===== */
.quote-form-panel label>.fl{display:flex;flex-wrap:wrap;align-items:center;gap:6px;color:inherit}
.quote-form-panel .req{color:#b0333e;font-style:normal;font-weight:700}
.quote-form-panel .opt{padding:1px 7px;border-radius:999px;background:#f1eeec;color:#8e8582;font-size:11px;font-style:normal;font-weight:600;letter-spacing:.2px}
.quote-form-panel input,.quote-form-panel select,.quote-form-panel textarea{color:var(--ink)}
.quote-form-panel input:-webkit-autofill,.quote-form-panel input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 100px #ffffff inset;-webkit-text-fill-color:var(--ink);caret-color:var(--ink)}
.privacy-note svg{margin:0 6px -2px 0;vertical-align:baseline}
html[data-theme=dark] .quote-form-panel .req{color:#e0707a}
html[data-theme=dark] .quote-form-panel label>.fl{color:inherit}
html[data-theme=dark] .quote-form-panel .opt{background:#2a2425;color:#a39b98}
html[data-theme=dark] .quote-form-panel input:-webkit-autofill,html[data-theme=dark] .quote-form-panel input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 100px #121010 inset;-webkit-text-fill-color:#e8e6e4}
/* Phones: one clean column, required fields first, larger rounded fields with a clear focus ring */
@media(max-width:650px){
.quote-form-panel{padding:22px 18px 18px}
.quote-form-panel h3{margin-bottom:4px;font-size:19px}
#quote-form{display:flex;flex-direction:column;gap:16px}
#quote-form>.form-row:not(.custom-request-fields){display:contents}
#quote-form>h3{order:0}
#quote-form .f-name{order:1}
#quote-form .f-phone{order:2}
#quote-form .f-city{order:3}
#quote-form .f-team{order:4}
#quote-form>.custom-request-fields{order:5}
#quote-form .f-notes{order:6}
#quote-form .design-check{order:7}
#quote-form .hp-field{order:8}
#quote-form .privacy-note{order:9}
#quote-form .form-hint{order:10}
#quote-form>button[type=submit]{order:11}
.quote-form-panel label{gap:7px;font-size:13.5px;font-weight:600;color:#4d4340}
.quote-form-panel input,.quote-form-panel select,.quote-form-panel textarea{min-height:50px;padding:12px 14px;border:1.5px solid #e2dcd9;border-radius:12px;background:#fbfaf9;transition:border-color .15s,box-shadow .15s}
.quote-form-panel input:focus,.quote-form-panel select:focus,.quote-form-panel textarea:focus{outline:none;border-color:#922a33;background:#ffffff;box-shadow:0 0 0 3px #922a3322}
.quote-form-panel input::placeholder,.quote-form-panel textarea::placeholder{color:#b3aba8;font-size:15px}
.quote-form-panel textarea{min-height:92px}
.quote-form-panel input:-webkit-autofill{-webkit-box-shadow:0 0 0 100px #fbfaf9 inset}
.quote-form-panel .phone-field select{flex-basis:108px;width:108px}
.phone-hint{margin-top:-1px;font-size:12px;font-weight:500}
#quote-form>.custom-request-fields{display:grid;grid-template-columns:minmax(0,1fr) 96px;align-items:end;gap:10px;margin:0;padding:14px;border:1.5px dashed #e2dcd9;border-radius:14px}
.quote-form-panel .design-check{margin:0;padding:12px 14px;min-height:52px;border:1.5px solid #e2dcd9;border-radius:12px;background:#fbfaf9;font-size:14.5px;font-weight:600}
.quote-form-panel .design-check:has(input:checked){border-color:#922a33;background:#fbf2f2}
.quote-form-panel .design-check input{width:22px;height:22px}
.privacy-note{margin:0;font-size:12px;line-height:1.55}
.form-hint{margin:-10px 0 0;font-size:12px;line-height:1.55}
html[data-theme=dark] .quote-form-panel label{color:#d2cbc8}
html[data-theme=dark] .quote-form-panel input,html[data-theme=dark] .quote-form-panel select,html[data-theme=dark] .quote-form-panel textarea{border-color:#3b3331;background:#171415}
html[data-theme=dark] .quote-form-panel input:focus,html[data-theme=dark] .quote-form-panel select:focus,html[data-theme=dark] .quote-form-panel textarea:focus{border-color:#d56e77;background:#121010;box-shadow:0 0 0 3px #d56e7733}
html[data-theme=dark] .quote-form-panel input:-webkit-autofill{-webkit-box-shadow:0 0 0 100px #171415 inset}
html[data-theme=dark] #quote-form>.custom-request-fields{border-color:#3b3331}
html[data-theme=dark] .quote-form-panel .design-check{border-color:#3b3331;background:#171415}
html[data-theme=dark] .quote-form-panel .design-check:has(input:checked){border-color:#d56e77;background:#241a1b}
}