.brooz-app{
  --black:#0a0404;--blood:#4a0a0a;--crimson:#c8161d;--glow:#ff2a33;
  --chalk:#efe6da;--dim:#b0a294;
  --ease:cubic-bezier(.19,1,.22,1);
}
.brooz-app, .brooz-app *{margin:0;padding:0;box-sizing:border-box}
.brooz-app{font-family:"Cairo",sans-serif;background:var(--black);color:var(--chalk);line-height:1.6}
.brooz-app ::selection{background:var(--crimson);color:#fff}
.brooz-app img{pointer-events:none;user-select:none}
.brooz-app button{font-family:"Cairo",sans-serif}
/* noise */
.brooz-app::after{content:"";position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.45;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E")}
/* ===== NAV ===== */
.brooz-app nav{position:fixed;top:0;right:0;left:0;z-index:1000;display:flex;justify-content:space-between;align-items:center;padding:1.1rem 5vw;mix-blend-mode:normal}
.brooz-app .logo{display:flex;align-items:baseline;gap:.45rem;cursor:pointer}
.brooz-app .logo .en{font-family:"Anton";font-size:1.4rem;letter-spacing:.08em}
.brooz-app .logo .ar{font-family:"Aref Ruqaa";font-size:1.3rem;color:var(--crimson)}
.brooz-app .cart-btn{position:relative;background:rgba(10,4,4,.55);backdrop-filter:blur(8px);border:1.5px solid var(--crimson);color:var(--chalk);padding:.45rem 1.3rem;border-radius:2px;font-weight:800;font-size:.9rem;cursor:pointer;transition:.3s}
.brooz-app .cart-btn:hover{background:var(--crimson);box-shadow:0 0 25px rgba(200,22,29,.6)}
.brooz-app .cart-count{position:absolute;top:-9px;left:-9px;min-width:20px;height:20px;border-radius:50%;background:var(--glow);color:#fff;font-size:.7rem;font-weight:900;display:flex;align-items:center;justify-content:center;transform:scale(0);transition:transform .3s cubic-bezier(.68,-.55,.27,1.55)}
.brooz-app .cart-count.show{transform:scale(1)}
/* ===== PROGRESS DOTS ===== */
.brooz-app .dots{position:fixed;left:1.4rem;top:50%;transform:translateY(-50%);z-index:1000;display:flex;flex-direction:column;gap:1rem}
.brooz-app .dot{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--dim);background:transparent;cursor:pointer;padding:0;transition:.4s}
.brooz-app .dot.on{background:var(--crimson);border-color:var(--crimson);box-shadow:0 0 14px rgba(255,42,51,.8);transform:scale(1.35)}
.brooz-app .swipe-hint{position:fixed;bottom:1.3rem;right:50%;transform:translateX(50%);z-index:1000;color:var(--dim);font-size:.72rem;letter-spacing:.3em;animation:hintPulse 2.2s infinite}
@keyframes hintPulse{0%,100%{opacity:.4;transform:translateX(50%) translateY(0)}50%{opacity:1;transform:translateX(50%) translateY(-6px)}}
/* ===== SCENES ENGINE ===== */
.brooz-app .scene{position:fixed;inset:0;visibility:hidden;z-index:1;display:flex;align-items:center;justify-content:center;overflow:hidden}
.brooz-app .scene.active{visibility:visible;z-index:5}
.brooz-app .scene.leaving{visibility:visible;z-index:4}
/* enter animations - each scene different */
.brooz-app .scene.active .fx{animation-fill-mode:both}
.brooz-app .scene.active.enter-zoom{animation:enterZoom 1.1s var(--ease) both}
.brooz-app .scene.active.enter-wipe{animation:enterWipe 1s var(--ease) both}
.brooz-app .scene.active.enter-iris{animation:enterIris 1.1s var(--ease) both}
.brooz-app .scene.active.enter-slide{animation:enterSlide 1s var(--ease) both}
.brooz-app .scene.leaving{animation:leaveFade .9s var(--ease) both}
@keyframes enterZoom{from{transform:scale(1.35);filter:blur(20px);opacity:0}to{transform:scale(1);filter:blur(0);opacity:1}}
@keyframes enterWipe{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0 0 0 0)}}
@keyframes enterIris{from{clip-path:circle(0% at 50% 50%)}to{clip-path:circle(75% at 50% 50%)}}
@keyframes enterSlide{from{transform:translateY(100%) skewY(4deg)}to{transform:translateY(0) skewY(0)}}
@keyframes leaveFade{from{transform:scale(1);filter:blur(0);opacity:1}to{transform:scale(.92);filter:blur(14px);opacity:0}}
/* staggered children */
.brooz-app .st{opacity:0;transform:translateY(60px)}
.brooz-app .scene.active .st{animation:stUp .9s var(--ease) both}
.brooz-app .scene.active .st:nth-child(1),.brooz-app .scene.active [data-st="1"]{animation-delay:.35s}
.brooz-app .scene.active [data-st="2"]{animation-delay:.5s}
.brooz-app .scene.active [data-st="3"]{animation-delay:.65s}
.brooz-app .scene.active [data-st="4"]{animation-delay:.8s}
.brooz-app .scene.active [data-st="5"]{animation-delay:.95s}
@keyframes stUp{from{opacity:0;transform:translateY(60px)}to{opacity:1;transform:translateY(0)}}
.brooz-app .bg{position:absolute;inset:0;z-index:-1}
.brooz-app .bg img{width:100%;height:100%;object-fit:cover;filter:saturate(.8) contrast(1.1)}
.brooz-app .bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,rgba(74,10,10,.35),rgba(10,4,4,.88) 75%)}
.brooz-app .scene.active .bg img{animation:kenburns 8s ease-out both}
@keyframes kenburns{from{transform:scale(1.15)}to{transform:scale(1)}}
/* ===== SCENE 1: HERO ===== */
.brooz-app .hero-mark{position:relative;line-height:1;text-align:center}
.brooz-app .hero-mark .en{font-family:"Anton";font-size:clamp(4.5rem,18vw,15rem);letter-spacing:.02em;display:block;text-shadow:0 6px 0 rgba(0,0,0,.5),0 0 70px rgba(239,230,218,.15)}
.brooz-app .hero-mark .ar{font-family:"Aref Ruqaa";font-size:clamp(3.2rem,12.5vw,10.5rem);color:var(--crimson);position:absolute;top:52%;right:50%;transform:translate(50%,-44%);text-shadow:0 3px 0 rgba(0,0,0,.5),0 0 50px rgba(255,42,51,.55)}
.brooz-app .hero-tag{font-size:clamp(1rem,2.3vw,1.5rem);font-weight:900;text-align:center;margin-top:2rem}
.brooz-app .hero-tag span{color:var(--glow)}
.brooz-app .hero-cta{display:flex;gap:1rem;justify-content:center;margin-top:2rem}
.brooz-app .btn{padding:.85rem 2.5rem;border-radius:2px;font-weight:900;font-size:1rem;cursor:pointer;border:none;transition:.3s}
.brooz-app .btn-r{background:var(--crimson);color:#fff}
.brooz-app .btn-r:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(200,22,29,.6)}
.brooz-app .btn-g{background:transparent;color:var(--chalk);border:1.5px solid rgba(239,230,218,.4)}
.brooz-app .btn-g:hover{border-color:#fff;transform:translateY(-3px)}
/* ===== SCENE 2: MANIFESTO ===== */
.brooz-app .mani{text-align:center;padding:0 6vw}
.brooz-app .mani-word{font-family:"Aref Ruqaa";font-size:clamp(6rem,22vw,16rem);line-height:1;color:transparent;-webkit-text-stroke:2px var(--crimson);transition:.5s;cursor:default}
.brooz-app .mani-word:hover{color:var(--crimson);text-shadow:0 0 90px rgba(255,42,51,.6)}
.brooz-app .mani-line{font-size:clamp(1.1rem,2.6vw,1.7rem);font-weight:900;margin-top:1.5rem}
.brooz-app .mani-tags{display:flex;gap:1.2rem;justify-content:center;margin-top:2rem;flex-wrap:wrap}
.brooz-app .mani-tags span{border:1px solid rgba(200,22,29,.5);padding:.45rem 1.5rem;border-radius:2px;color:var(--dim);font-weight:700;font-size:.9rem;transition:.3s}
.brooz-app .mani-tags span:hover{background:var(--crimson);color:#fff;border-color:var(--crimson);transform:translateY(-4px)}
/* ===== SCENE 3: STORE ===== */
.brooz-app .store-scene{flex-direction:column;padding:5.5rem 0 3.5rem}
.brooz-app .store-head{text-align:center;margin-bottom:1.2rem}
.brooz-app .store-head h2{font-family:"Anton";font-size:clamp(1.8rem,4.5vw,3rem);letter-spacing:.08em}
.brooz-app .store-head h2 em{font-style:normal;color:var(--crimson)}
.brooz-app .filters{display:flex;gap:.7rem;justify-content:center;margin-bottom:1.4rem}
.brooz-app .chip{background:transparent;border:1.5px solid rgba(239,230,218,.3);color:var(--dim);padding:.4rem 1.5rem;border-radius:2px;font-weight:800;cursor:pointer;transition:.3s}
.brooz-app .chip.active{background:var(--crimson);border-color:var(--crimson);color:#fff}
.brooz-app .rail-wrap{position:relative;width:100%;flex:1;display:flex;align-items:center;overflow:hidden}
.brooz-app .rail{display:flex;gap:1.6rem;padding:0 8vw;transition:transform .7s var(--ease);will-change:transform}
.brooz-app .pcard{flex:0 0 min(310px,74vw);background:#150808;border:1px solid rgba(200,22,29,.25);border-radius:6px;overflow:hidden;transition:transform .6s var(--ease),box-shadow .6s,border-color .4s;transform:perspective(900px)}
.brooz-app .pcard:hover{transform:perspective(900px) translateY(-10px) rotateY(-4deg);border-color:var(--crimson);box-shadow:0 25px 70px rgba(0,0,0,.7),0 0 45px rgba(200,22,29,.18)}
.brooz-app .pimg{position:relative;height:280px;overflow:hidden}
.brooz-app .pimg img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.08);transition:transform .8s var(--ease)}
.brooz-app .pcard:hover .pimg img{transform:scale(1.1)}
.brooz-app .pimg::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,4,4,.85),transparent 55%)}
.brooz-app .ptag{position:absolute;top:.9rem;right:.9rem;z-index:2;background:var(--crimson);color:#fff;font-size:.68rem;font-weight:900;padding:.2rem .8rem;letter-spacing:.12em;border-radius:2px}
.brooz-app .pmark{position:absolute;bottom:.7rem;right:1rem;z-index:2;font-family:"Aref Ruqaa";color:var(--glow);font-size:1.5rem;text-shadow:0 0 15px rgba(255,42,51,.7)}
.brooz-app .pbody{padding:1.1rem 1.2rem 1.3rem}
.brooz-app .pname{font-weight:900;font-size:1.05rem}
.brooz-app .pname small{display:block;font-family:"Anton";font-weight:400;color:var(--dim);font-size:.72rem;letter-spacing:.2em;margin-top:.1rem}
.brooz-app .pfoot{display:flex;justify-content:space-between;align-items:center;margin-top:.9rem;gap:.8rem}
.brooz-app .price{font-family:"Anton";font-size:1.25rem;color:var(--glow)}
.brooz-app .price small{font-family:"Cairo";font-size:.7rem;color:var(--dim)}
.brooz-app .sizes{display:flex;gap:.35rem;margin-top:.7rem}
.brooz-app .size{width:32px;height:28px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(239,230,218,.25);font-size:.72rem;font-weight:800;color:var(--dim);cursor:pointer;border-radius:2px;transition:.25s}
.brooz-app .size.sel{background:var(--chalk);color:var(--black);border-color:var(--chalk)}
.brooz-app .add{background:transparent;border:1.5px solid var(--crimson);color:var(--chalk);border-radius:2px;padding:.5rem 1.2rem;font-weight:900;font-size:.82rem;cursor:pointer;transition:.3s;white-space:nowrap}
.brooz-app .add:hover,.brooz-app .add.ok{background:var(--crimson);color:#fff;box-shadow:0 0 20px rgba(200,22,29,.5)}
.brooz-app .rail-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:10;width:48px;height:48px;border-radius:50%;background:rgba(10,4,4,.7);backdrop-filter:blur(6px);border:1.5px solid var(--crimson);color:var(--chalk);font-size:1.3rem;cursor:pointer;transition:.3s;display:flex;align-items:center;justify-content:center}
.brooz-app .rail-nav:hover{background:var(--crimson)}
.brooz-app .rail-prev{right:1.2rem}
.brooz-app .rail-next{left:1.2rem}
/* ===== SCENE 4: STORY ===== */
.brooz-app .story-quote{font-size:clamp(1.5rem,4vw,2.8rem);font-weight:900;line-height:1.7;text-align:center;max-width:900px;padding:0 6vw}
.brooz-app .story-quote em{font-style:normal;color:var(--glow)}
.brooz-app .story-sub{color:var(--dim);text-align:center;margin-top:1.2rem;font-size:1.05rem}
/* ===== SCENE 5: CTA ===== */
.brooz-app .cta-mark{font-family:"Anton";font-size:clamp(3rem,10vw,7rem);letter-spacing:.05em;position:relative;display:inline-block}
.brooz-app .cta-mark .ar{font-family:"Aref Ruqaa";font-size:.55em;color:var(--crimson);position:absolute;top:50%;right:50%;transform:translate(50%,-45%);text-shadow:0 0 30px rgba(255,42,51,.5)}
.brooz-app .cta-inner{text-align:center}
.brooz-app .socials{display:flex;gap:1.4rem;justify-content:center;margin-top:2.2rem}
.brooz-app .socials a{color:var(--dim);text-decoration:none;font-weight:800;font-size:.95rem;border-bottom:2px solid transparent;transition:.3s}
.brooz-app .socials a:hover{color:var(--glow);border-color:var(--glow)}
.brooz-app .copy{color:rgba(176,162,148,.45);font-size:.75rem;margin-top:2.5rem}
/* ===== CART ===== */
.brooz-app .overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(5px);z-index:1500;opacity:0;pointer-events:none;transition:.4s}
.brooz-app .overlay.open{opacity:1;pointer-events:auto}
.brooz-app .drawer{position:fixed;top:0;bottom:0;left:0;width:min(420px,92vw);z-index:1600;background:#140606;border-right:1px solid rgba(200,22,29,.4);transform:translateX(-105%);transition:transform .55s var(--ease);display:flex;flex-direction:column}
.brooz-app .drawer.open{transform:translateX(0)}
.brooz-app .d-head{padding:1.3rem 1.5rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(200,22,29,.25)}
.brooz-app .d-head h3{font-weight:900}
.brooz-app .d-head h3 span{font-family:"Aref Ruqaa";color:var(--crimson);margin-left:.4rem}
.brooz-app .x{background:none;border:none;color:var(--dim);font-size:1.5rem;cursor:pointer;transition:.3s}
.brooz-app .x:hover{color:var(--glow);transform:rotate(90deg)}
.brooz-app .d-items{flex:1;overflow-y:auto;padding:1.1rem 1.4rem;display:flex;flex-direction:column;gap:1rem}
.brooz-app .empty{text-align:center;color:var(--dim);margin-top:4rem}
.brooz-app .empty b{font-family:"Aref Ruqaa";font-size:3rem;color:rgba(200,22,29,.45);display:block;font-weight:700}
.brooz-app .ci{display:grid;grid-template-columns:60px 1fr auto;gap:.9rem;align-items:center;border:1px solid rgba(200,22,29,.2);padding:.7rem;border-radius:4px;background:rgba(74,10,10,.12);animation:ciIn .4s var(--ease)}
@keyframes ciIn{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:none}}
.brooz-app .ci img{width:60px;height:60px;object-fit:cover;border-radius:3px}
.brooz-app .ci-n{font-weight:800;font-size:.9rem}
.brooz-app .ci-m{font-size:.75rem;color:var(--dim)}
.brooz-app .ci-p{font-family:"Anton";color:var(--glow);margin-top:.15rem}
.brooz-app .rm{background:none;border:none;color:var(--dim);font-size:.72rem;cursor:pointer;text-decoration:underline;margin-top:.2rem}
.brooz-app .rm:hover{color:var(--glow)}
.brooz-app .qty{display:flex;flex-direction:column;align-items:center;gap:.35rem}
.brooz-app .qty button{width:25px;height:25px;background:transparent;border:1px solid rgba(239,230,218,.3);color:var(--chalk);cursor:pointer;border-radius:2px;font-weight:900;transition:.25s}
.brooz-app .qty button:hover{border-color:var(--crimson);color:var(--glow)}
.brooz-app .qty span{font-weight:900}
.brooz-app .d-foot{padding:1.3rem 1.5rem;border-top:1px solid rgba(200,22,29,.25)}
.brooz-app .trow{display:flex;justify-content:space-between;font-weight:900;margin-bottom:.9rem}
.brooz-app .trow b{font-family:"Anton";color:var(--glow);font-size:1.3rem}
.brooz-app .chk{width:100%;background:var(--crimson);color:#fff;border:none;padding:.95rem;font-weight:900;font-size:1rem;cursor:pointer;border-radius:2px;transition:.3s}
.brooz-app .chk:hover{box-shadow:0 0 30px rgba(200,22,29,.6);transform:translateY(-2px)}
.brooz-app .note{text-align:center;font-size:.72rem;color:var(--dim);margin-top:.6rem}
.brooz-app .toast{position:fixed;bottom:1.8rem;right:50%;transform:translate(50%,130px);z-index:2000;background:var(--crimson);color:#fff;padding:.75rem 1.7rem;border-radius:3px;font-weight:800;box-shadow:0 10px 40px rgba(0,0,0,.55);transition:transform .5s var(--ease)}
.brooz-app .toast.show{transform:translate(50%,0)}
@media (max-width:700px){.brooz-app .dots{left:.7rem;gap:.8rem}
.brooz-app .dot{width:8px;height:8px}
.brooz-app .rail{padding:0 12vw}
.brooz-app .rail-nav{display:none}
.brooz-app .pimg{height:240px}}
@media (prefers-reduced-motion:reduce){.brooz-app, .brooz-app *{animation-duration:.01ms!important;transition-duration:.01ms!important;animation-delay:0s!important}
.brooz-app .st{opacity:1;transform:none}}
.brooz-app button:focus-visible,.brooz-app a:focus-visible{outline:2px solid var(--glow);outline-offset:3px}

html.brooz-app-active, body.brooz-app-active { height:100%; overflow:hidden; }
.brooz-app { position:fixed; inset:0; z-index:10; min-height:100vh; background:#0a0404; color:#efe6da; direction:rtl; }
body.admin-bar .brooz-app { top:32px; }
.brooz-app a { color:inherit; }
.brooz-app .logo { text-decoration:none; }
.brooz-app .pimg > a { display:block; width:100%; height:100%; }
.brooz-app .pname a { text-decoration:none; }
.brooz-app .add { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
.brooz-app .add.loading { opacity:.65; pointer-events:none; }
.brooz-app .add.added { background:var(--crimson); color:#fff; }
.brooz-app .pcard[hidden] { display:none !important; }
.brooz-app .product-placeholder { display:flex; align-items:center; justify-content:center; text-align:center; min-height:280px; padding:2rem; color:var(--dim); border:1px dashed rgba(200,22,29,.45); }
.brooz-app .drawer { overflow:hidden; }
.brooz-app .brooz-mini-cart-contents { flex:1; overflow:auto; padding:1.1rem 1.4rem; }
.brooz-app .woocommerce-mini-cart { list-style:none; display:flex; flex-direction:column; gap:1rem; margin:0; padding:0; }
.brooz-app .woocommerce-mini-cart-item { position:relative; min-height:82px; border:1px solid rgba(200,22,29,.2); padding:.75rem 2.1rem .75rem .75rem; border-radius:4px; background:rgba(74,10,10,.12); }
.brooz-app .woocommerce-mini-cart-item > a:not(.remove) { display:block; text-decoration:none; font-weight:800; }
.brooz-app .woocommerce-mini-cart-item img { width:62px; height:62px; object-fit:cover; border-radius:3px; float:right; margin-left:.8rem; }
.brooz-app .woocommerce-mini-cart-item .remove { position:absolute; top:.45rem; left:.55rem; text-decoration:none; color:var(--dim); font-size:1.25rem; line-height:1; }
.brooz-app .woocommerce-mini-cart-item .remove:hover { color:var(--glow); }
.brooz-app .woocommerce-mini-cart-item .quantity { display:block; color:var(--dim); font-size:.8rem; margin-top:.4rem; }
.brooz-app .woocommerce-mini-cart__total { display:flex; justify-content:space-between; border-top:1px solid rgba(200,22,29,.25); margin:1rem 0 0; padding:1rem 0 0; font-weight:900; }
.brooz-app .woocommerce-mini-cart__total .amount { color:var(--glow); }
.brooz-app .woocommerce-mini-cart__buttons { display:grid; grid-template-columns:1fr 1fr; gap:.7rem; margin:.9rem 0 0; }
.brooz-app .woocommerce-mini-cart__buttons a { text-align:center; text-decoration:none; border:1px solid var(--crimson); padding:.75rem .5rem; font-weight:900; }
.brooz-app .woocommerce-mini-cart__buttons .checkout { background:var(--crimson); color:#fff; }
.brooz-app .woocommerce-mini-cart__empty-message { text-align:center; color:var(--dim); margin-top:4rem; }
.brooz-app .wc-block-components-drawer { z-index:99999; }
.brooz-standard-site { min-height:100vh; background:#0a0404; color:#efe6da; }
.brooz-site-header { position:sticky; top:0; z-index:100; display:flex; justify-content:space-between; align-items:center; padding:1rem 5vw; background:rgba(10,4,4,.94); border-bottom:1px solid rgba(200,22,29,.25); }
.brooz-site-brand { text-decoration:none; font-family:Anton, sans-serif; font-size:1.5rem; color:#efe6da; }
.brooz-site-brand span { color:#c8161d; font-family:'Aref Ruqaa', serif; margin-right:.4rem; }
.brooz-site-cart { text-decoration:none; border:1px solid #c8161d; padding:.45rem 1rem; color:#efe6da; }
.brooz-content { width:min(1200px,92vw); margin:0 auto; padding:3rem 0 5rem; }
.brooz-content a { color:#ff2a33; }
.woocommerce .button, .woocommerce button.button, .woocommerce input.button { background:#c8161d !important; color:#fff !important; border-radius:2px !important; }
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { background:#150808; border:1px solid rgba(200,22,29,.25); padding:1rem; }
.woocommerce div.product p.price, .woocommerce div.product span.price, .woocommerce ul.products li.product .price { color:#ff2a33; }
@media(max-width:782px){ body.admin-bar .brooz-app{top:46px;} }
@media(max-width:700px){ .brooz-app .woocommerce-mini-cart__buttons{grid-template-columns:1fr;} }

.brooz-app .demo-disabled{opacity:.6;cursor:not-allowed;pointer-events:none;}
