/* Mabruk identity — original owner-supplied artwork, shared across all views. */
:root{--teal:#655333;--deep:#302e29;--ink:#302e29;--muted:#726c62;--line:#e2ddd3;--bg:#f7f5f0;--pale:#eee8dc;--brand-gold:#d1bc8e}
body{background:var(--bg)}
.brand{display:inline-flex;align-items:center;gap:12px;flex-shrink:0;letter-spacing:0;text-decoration:none}
.brand .brand-logo{display:block;width:64px;height:64px;object-fit:contain;border-radius:12px;border:1px solid #c9bea6;box-shadow:0 3px 10px #302e2912}
.brand .brand-name{color:var(--ink);font-family:Georgia,serif;font-size:30px;font-weight:400;letter-spacing:-1px;line-height:1.05}
.brand-name small{display:block;margin-top:7px;font-family:Manrope,"Segoe UI",sans-serif;font-size:8px;font-weight:600;letter-spacing:.13em;color:var(--muted)}
.notice-bar{background:#302e29;color:#f2eadb}.site-header{background:var(--bg)}
.button{background:var(--deep);color:#fff}.button:hover{background:#514738;color:#fff}.button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-color:#9a7e49}
.hero{background:radial-gradient(ellipse at 95% 10%,#96856b66,transparent 60%),linear-gradient(120deg,#262521,#454137 65%,#726550);box-shadow:0 24px 55px -25px #302e2955}
.hero h1 em{color:#e4d2ae}.hero p,.hero-trust{color:#eee9df}.hero .eyebrow{color:#f4ecdb}.hero .eyebrow::before{background:#d1bc8e;box-shadow:0 0 0 4px #d1bc8e20}
.hero-button{background:#f1e5cc;color:#302e29}.hero-button:hover{background:#fff6e5;color:#302e29}.hero-button span{background:#4b4233;color:#fff}.check-circle{border-color:#d1bc8e}.hero-wave .wave-back{fill:#d8c9aa}
.hero-art.brand-art{position:relative;display:grid;place-items:center;padding:30px 38px 75px;min-height:430px;transform:none;overflow:visible}
.brand-portrait{position:relative;z-index:1;width:min(100%,330px);margin:0;text-align:center}
.brand-portrait img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:28px;border:1px solid #d1bc8e80;box-shadow:0 24px 60px #0004}
.brand-portrait figcaption{font-size:9px;letter-spacing:.18em;color:#e5d8bd;line-height:1.6;margin-top:17px}
.brand-halo{position:absolute;width:370px;height:370px;max-width:90%;border:1px solid #d1bc8e40;border-radius:46% 54% 60% 40%;transform:rotate(-15deg);box-shadow:0 0 0 22px #d1bc8e08,0 0 0 45px #d1bc8e06;pointer-events:none}
.chip.active{background:#3e3930;border-color:#3e3930;color:white}.product-price,.section-heading .eyebrow{color:#655333}
.account-intro{background:linear-gradient(145deg,#eee8dc,#dfd6c5)}.account-brand{margin:28px 0 0}.account-brand img{display:block;width:180px;height:180px;object-fit:contain;border-radius:24px;border:1px solid #c9bea6}
.admin-sidebar{background:#f0ece4}.admin-sidebar button{color:#655d50}.admin-sidebar button.active{background:var(--deep);color:white}
.data-table th{background:#f0ece4;color:#655d50}.info-box{background:#f2eee5;color:#5e5443}.summary-callout{background:linear-gradient(120deg,#eee7da,#ded3be)}
.site-footer .brand-logo{width:58px;height:58px}.site-footer .brand-name{font-size:27px}.site-footer .developer-credit{color:var(--muted)}.developer-credit strong{color:#655333}
.error-page>.brand{display:inline-flex}.mabruk-document-logo{width:100px;height:100px;max-height:100px;border-radius:12px}.document-header{border-color:#a68b55}.document th{background:#f0ece4;color:#514633}.document-totals h2{border-color:#a68b55}
@media(max-width:1100px) and (min-width:768px){.brand-name small{display:none}.brand .brand-name{font-size:25px}.brand .brand-logo{width:54px;height:54px}.hero-art.brand-art{padding:25px 24px 75px}.brand-portrait{max-width:270px}}
@media(max-width:767px){.site-header{gap:12px}.brand{gap:9px}.brand .brand-logo{width:52px;height:52px;border-radius:10px}.brand .brand-name{font-size:25px}.brand-name small{font-size:6px;letter-spacing:.08em;margin-top:6px}.hero-art.brand-art{width:100%;height:auto;min-height:0;right:auto;bottom:auto;padding:24px 24px 65px;margin:0;opacity:1}.brand-portrait{width:205px}.brand-portrait img{border-radius:22px}.brand-portrait figcaption{font-size:7px;margin-top:12px}.brand-halo{width:220px;height:220px}.account-brand{margin:18px 0}.account-brand img{width:96px;height:96px;border-radius:16px}.mobile-nav a[aria-current]{background:#eee6d7;color:#655333}.site-footer .brand-logo{width:52px;height:52px}}
@media(max-width:360px){.brand-name small{display:none}.brand .brand-name{font-size:22px}.site-header{padding:0 14px}.header-actions{gap:7px}}
@media print{body{background:white}.document-header{break-inside:avoid}.document .company-logo{print-color-adjust:exact;-webkit-print-color-adjust:exact}}
/* Neutral surfaces keep the original artwork as the strongest visual accent. */
.journey-step>span{background:linear-gradient(140deg,#e6ddcc,#f4efe5);color:#655333}
.aside-card{background:linear-gradient(150deg,#eee8dc,#e2d7c2)}
.product-image{background:linear-gradient(140deg,#f2eee7,#e7e0d4)}
.empty{background:radial-gradient(ellipse at 80% 10%,#f0e9dd,transparent 65%),#fff}
.empty::before{background:linear-gradient(130deg,#e8dfcf,#f6f1e8);border-color:#faf7f1;color:#655333}
.search-box{background:#faf8f3;border-color:var(--line)}
.search-box:focus-within{border-color:#a68b55;box-shadow:0 0 0 3px #a68b5518}

/* Diamond lighting: fixed artwork with frequent facet reflections. */
.diamond-stage{position:relative;isolation:isolate;border-radius:28px;animation:none;transform:none}
.diamond-stage img{position:relative;z-index:1}
.diamond-light{position:absolute;inset:0;z-index:2;overflow:hidden;border-radius:inherit;pointer-events:none}
.diamond-light::before{content:"";position:absolute;inset:-25% -65%;background:linear-gradient(110deg,transparent 38%,#fff2 44%,#fff9 49%,#fffd 50%,#e8d5ac66 53%,transparent 61%);transform:translateX(-65%);animation:mabruk-shine 3.8s ease-in-out infinite}
.diamond-light::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 64% 14%,#fff9,transparent 15%),radial-gradient(ellipse at 23% 69%,#d6eeff88,transparent 12%),radial-gradient(ellipse at 78% 78%,#ffe3a477,transparent 14%);mix-blend-mode:screen;opacity:0;animation:mabruk-facets 4.6s ease-in-out infinite}
.diamond-glint{position:absolute;z-index:3;width:35px;height:35px;opacity:0;pointer-events:none;background:radial-gradient(circle,#fff 0 8%,#fff9 13%,#e8d5ac33 28%,transparent 54%);animation:mabruk-glint 3.3s ease-in-out infinite}
.diamond-glint::before,.diamond-glint::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:100%}
.diamond-glint::before{width:2px;height:100%;background:linear-gradient(transparent,#fff,transparent)}
.diamond-glint::after{width:100%;height:2px;background:linear-gradient(90deg,transparent,#fff,transparent)}
.diamond-glint.one{top:15%;left:61%;animation-delay:0s}
.diamond-glint.two{top:67%;left:20%;animation-delay:1.1s;width:28px;height:28px}
.diamond-glint.three{top:77%;right:17%;animation-delay:2.2s;width:32px;height:32px}
.brand-art .brand-halo::after{content:"";position:absolute;inset:-20px;border-radius:50%;background:radial-gradient(ellipse,#ead4a53e,transparent 67%);animation:mabruk-glow 5s ease-in-out infinite;pointer-events:none}
@keyframes mabruk-shine{0%{transform:translateX(-65%);opacity:0}12%{opacity:.9}65%{transform:translateX(65%);opacity:.9}78%,100%{transform:translateX(65%);opacity:0}}
@keyframes mabruk-glint{0%,60%,100%{opacity:0;transform:scale(.65)}28%{opacity:1;transform:scale(1.2)}}
@keyframes mabruk-facets{0%,100%{opacity:.08}45%{opacity:.65}75%{opacity:.2}}
@keyframes mabruk-glow{0%,100%{opacity:.35}50%{opacity:.85}}
@media(max-width:767px){.diamond-stage{border-radius:22px}.diamond-glint{width:27px;height:27px}.diamond-glint.two{width:23px;height:23px}.diamond-glint.three{width:25px;height:25px}}
@media(prefers-reduced-motion:reduce){.diamond-light::before,.diamond-light::after,.diamond-glint,.brand-art .brand-halo::after{animation:none!important}.diamond-light,.diamond-glint{display:none}}
@media print{.diamond-light,.diamond-glint{display:none}}

/* Stronger facet sparkle with two additional, differently sized light points. */
.diamond-glint{background:radial-gradient(circle,#fff 0 12%,#fffbdccc 18%,#e5efff66 32%,transparent 65%)}
.diamond-glint::before{width:3px;box-shadow:0 0 8px #fff9}
.diamond-glint::after{height:3px;box-shadow:0 0 8px #fff9}
.diamond-glint.four{top:24%;left:20%;width:58px;height:58px;animation-delay:.55s}
.diamond-glint.five{top:57%;right:8%;width:40px;height:40px;animation-delay:1.7s}
@media(max-width:767px){.diamond-glint.four{width:43px;height:43px}.diamond-glint.five{width:30px;height:30px}}

/* Shared logo jewel: fixed image, clipped light and a small facet sparkle. */
.brand .brand-emblem{position:relative;display:block;flex-shrink:0;overflow:hidden;border-radius:12px;line-height:0;isolation:isolate}
.brand-emblem::before{content:"";position:absolute;inset:-25% -65%;z-index:2;pointer-events:none;background:linear-gradient(110deg,transparent 40%,#fff4 47%,#fffd 50%,#ead5a655 54%,transparent 60%);animation:mabruk-shine 4.8s ease-in-out infinite}
.brand-emblem::after{content:"";position:absolute;top:17%;right:20%;width:18px;height:18px;z-index:3;pointer-events:none;background:linear-gradient(transparent,#fff,transparent) center/2px 100% no-repeat,linear-gradient(90deg,transparent,#fff,transparent) center/100% 2px no-repeat,radial-gradient(circle,#fff 8%,#fff9 18%,transparent 60%);opacity:0;animation:mabruk-glint 3.6s ease-in-out infinite .8s}
.site-footer .brand-emblem::before{animation-delay:1.2s}
@media(max-width:767px){.brand .brand-emblem{border-radius:10px}}
@media(prefers-reduced-motion:reduce){.brand-emblem::before,.brand-emblem::after{animation:none!important;display:none}}
@media print{.brand-emblem::before,.brand-emblem::after{display:none}}

/* Fixed diamonds with larger point sparkles, without sweeping reflections. */
.diamond-light,.brand-emblem::before,.brand-art .brand-halo::after{display:none;animation:none}
.diamond-glint.one{width:48px;height:48px}
.diamond-glint.two{width:40px;height:40px}
.diamond-glint.three{width:46px;height:46px}
.diamond-glint.four{width:76px;height:76px}
.diamond-glint.five{width:56px;height:56px}
.brand-emblem::after{width:26px;height:26px;top:12%;right:13%}
@media(max-width:767px){.diamond-glint.one{width:36px;height:36px}.diamond-glint.two{width:30px;height:30px}.diamond-glint.three{width:34px;height:34px}.diamond-glint.four{width:54px;height:54px}.diamond-glint.five{width:42px;height:42px}.brand-emblem::after{width:22px;height:22px}}