/* Visual refresh layered over the existing wide, responsive site. */
:root{--vivid-ink:#17232a;--vivid-yellow:#f4b82f;--vivid-line:#e4e7e5}
body{background:linear-gradient(135deg,#e9edeb,#f6f6f2 45%,#eeeae0);color:var(--vivid-ink)}
.site{box-shadow:0 10px 40px #15232b0a;border-color:#dfe3df;border-radius:14px}
.site>header{background:#ffffffed;border-bottom:1px solid #e5e7e3;position:relative}
.site>header::after{content:"";position:absolute;height:3px;bottom:-1px;left:35px;width:65px;border-radius:4px;background:var(--vivid-yellow)}
.site>header nav button{padding:9px 7px;border-radius:6px;transition:background .2s,color .2s}
.site>header nav button:hover{background:#fff2cd;color:#8c5c00}
.hero{background:radial-gradient(ellipse at 83% 45%,#f4b82f26,transparent 60%),linear-gradient(120deg,#fff,#f0f2ed);padding-top:24px!important;padding-bottom:26px!important}
.hero::before{background:radial-gradient(ellipse at 82% 35%,#f1b63236,transparent 57%),linear-gradient(115deg,transparent 40%,#fff9 55%,transparent 70%);background-size:100% 100%,220% 100%}
.hero .eyebrow{display:inline-flex;gap:10px;align-items:center;font-size:12px;font-weight:700;letter-spacing:2.8px;padding:8px 12px;background:#fff8e4;border:1px solid #eedba7;border-radius:30px;margin-bottom:20px}
.hero .eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:#d09a1c;box-shadow:0 0 0 4px #e8b13818}
.hero h1{letter-spacing:-2px;color:#15232a}
.hero-image{mix-blend-mode:multiply}
.search{border:1px solid #d6dcd6;box-shadow:0 8px 24px #17232a09;border-radius:9px;padding:5px}
.gold{background:linear-gradient(115deg,#facb58,#ecaa1d);border-color:#edb642;box-shadow:0 2px 0 #b47e1a15;border-radius:7px}
.upload-actions button{border-color:#b9c0ba;background:#ffffff70;border-radius:7px}
.quick-products{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:13px}
.quick-products>span{font-size:12px;color:#68746e;margin-right:2px}
.quick-products button{padding:6px 11px;border-radius:20px;border:1px solid #dce0d9;background:#ffffffb5;font-size:12px;color:#47564e;transition:background .2s,border-color .2s}
.quick-products button:hover{background:#fff2cc;border-color:#d6b563}
.steps{background:#1c2b32;color:#f7f8f5;border:0;padding:13px 10px;gap:clamp(10px,2vw,30px)}
.steps i{color:#e3b44c}.steps button:hover{color:#ffd775}.steps button{font-size:24px}.steps span{font-size:11px}
.categories{padding-top:27px!important;padding-bottom:28px!important}
.section-title h2{font-size:26px;letter-spacing:-.8px}.section-title{margin-bottom:16px}
.category-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 17px}
.category-tools label{display:flex;align-items:center;gap:8px;max-width:380px;width:100%;font-size:14px;color:#68746e}
.category-tools input{padding:10px 12px;font-size:14px;background:#fff;border:1px solid #d8dfd7;border-radius:7px;min-width:0}
.category-count{font-size:12px;color:#6c756e;white-space:nowrap}
.category[hidden]{display:none!important}
.category{border:1px solid #e0e5dd;border-radius:11px;box-shadow:0 3px 10px #22342a04;isolation:isolate;transition:transform .25s,box-shadow .25s,border-color .25s}
.category b{background:#fff;border-top:1px solid #e6e9e3;position:relative;font-weight:600}
.category b::before{content:"";position:absolute;left:0;top:18%;bottom:18%;width:3px;background:#ecb02b;opacity:0;transition:opacity .2s}
.category b::after{border-radius:50%;width:24px;height:24px;background:#f6f1e4;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.category:hover{border-color:#d6b76c;box-shadow:0 10px 24px #20332612;transform:translateY(-4px)}
.category:hover b::before{opacity:1}.category:hover b::after{background:#f4bf43;color:#18262d}
.category-no-results{padding:22px;border:1px dashed #d4c394;border-radius:9px;color:#616e65;font-size:14px;line-height:1.5;background:#fffbef}
.list-banner{background:linear-gradient(115deg,#17282e,#2d403d);border-top:3px solid #e8b13d;padding-top:26px!important;padding-bottom:26px!important}
.list-banner::before{background:repeating-linear-gradient(125deg,transparent 0 28px,#ffffff05 28px 29px),radial-gradient(ellipse at 95% 50%,#f2b72e25,transparent 60%)}
.list-banner .paper{color:#f0c357}.list-banner p{color:#cdd8d3}
.bottom-info{background:#f5f7f3}.bottom-info h2,.bottom-info h3{color:#243d35}
.phone-card{border-color:#dce2d8;box-shadow:0 7px 24px #20362910;border-top:3px solid #eeb636}
.phone-hero{background:radial-gradient(ellipse at 70% 80%,#f1c45a1c,transparent 65%)}
.phone-category{border-radius:8px}.phone-actions{background:#fdfcf7}
.sidebar-benefits{background:#fff;border:1px solid #e4e8de;padding:20px 17px;gap:23px}
.sidebar-benefit svg{padding:5px;box-sizing:content-box;background:#fff4d6;border-radius:10px;color:#9c7116}
footer{background:#fff}.motion-toggle{flex-shrink:0}
dialog{border-radius:15px;border-top:4px solid #edb336}
.quote-form input:focus,.quote-form textarea:focus{outline:2px solid #dfb64e;outline-offset:2px}
@media(min-width:1101px){.motion-enabled:not(.motion-paused) .hero .eyebrow::before{animation:vivid-dot 4s ease-in-out infinite}}
@keyframes vivid-dot{50%{box-shadow:0 0 0 7px #e8b13808}}
@media(max-width:700px){.site{border-radius:0}.hero{padding-top:17px!important}.hero .eyebrow{font-size:10px;letter-spacing:1.9px;margin-bottom:15px}.hero h1{letter-spacing:-1.3px}.quick-products{margin-bottom:6px}.quick-products button{padding:7px 10px}.category-tools{gap:9px;flex-wrap:wrap}.category-tools label{max-width:none}.section-title h2{font-size:20px}.category b{font-size:12px}.category b::after{width:20px;height:20px}.site footer{gap:15px}.steps{display:none}}
@media(prefers-reduced-motion:reduce){.hero .eyebrow::before{animation:none!important}.category,.category b::before,.quick-products button,.site>header nav button{transition:none!important;transform:none!important}}