@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&family=Open+Sans:wght@400;500;600&display=swap');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Open Sans',sans-serif;color:#1a1a1a;background:#fff;overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
:root{--red:#8B0000;--red2:#A50000;--dark:#111111;--grey:#f5f5f5;--mid:#666;--border:#e0e0e0}
/* TOPBAR */
.topbar{background:var(--dark);color:#ccc;font-size:0.78rem;padding:0.5rem 5vw;display:flex;justify-content:space-between;align-items:center}
.topbar a{color:#ccc;transition:color .2s}.topbar a:hover{color:#fff}
.topbar__right{display:flex;gap:1.5rem}
/* NAV */
.navbar{position:sticky;top:0;z-index:200;background:#fff;border-bottom:3px solid var(--red);display:flex;align-items:center;padding:0 5vw;height:72px;gap:2rem;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.logo{display:flex;align-items:center;gap:0.6rem;flex-shrink:0}
.logo__icon{width:40px;height:40px;background:var(--red);display:flex;align-items:center;justify-content:center}
.logo__icon svg{width:24px;height:24px;fill:#fff}
.logo__text{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.05rem;letter-spacing:0.04em;color:var(--dark)}
.logo__text span{color:var(--red)}
.nav__links{display:flex;align-items:center;gap:0.1rem;list-style:none;flex:1}
.nav__links a{font-family:'Montserrat',sans-serif;font-size:0.78rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--dark);padding:0.45rem 0.8rem;border-radius:3px;transition:color .2s,background .2s}
.nav__links a:hover{color:var(--red);background:#fafafa}
.nav__links a.active{color:var(--red)}
/* BTN */
.btn{display:inline-block;font-family:'Montserrat',sans-serif;font-size:0.78rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:0.85rem 2rem;border:2px solid transparent;cursor:pointer;transition:all .2s;border-radius:2px}
.btn--red{background:var(--red);color:#fff;border-color:var(--red)}.btn--red:hover{background:var(--red2)}
.btn--outline{background:transparent;color:var(--red);border-color:var(--red)}.btn--outline:hover{background:var(--red);color:#fff}
.btn--dark{background:var(--dark);color:#fff;border-color:var(--dark)}.btn--dark:hover{background:#222}
/* BREADCRUMB */
.breadcrumb{background:var(--grey);padding:0.75rem 5vw;font-size:0.8rem;color:var(--mid);border-bottom:1px solid var(--border)}
.breadcrumb a{color:var(--red)}.breadcrumb a:hover{text-decoration:underline}
/* PRODUCT HERO */
.prod-hero{display:grid;grid-template-columns:1fr 1fr;gap:0;min-height:520px;border-bottom:1px solid var(--border)}
.prod-hero__gallery{background:#f9f9f9;padding:3rem;display:flex;flex-direction:column;gap:1rem;border-right:1px solid var(--border)}
.prod-hero__main-img{width:100%;aspect-ratio:1;object-fit:contain;cursor:zoom-in}
.prod-hero__thumbs{display:flex;gap:0.5rem}
.prod-hero__thumb{width:72px;height:72px;object-fit:contain;border:2px solid transparent;cursor:pointer;background:#fff;padding:4px;transition:border-color .2s}
.prod-hero__thumb.active,.prod-hero__thumb:hover{border-color:var(--red)}
.prod-hero__info{padding:3.5rem 3.5rem 3rem}
.prod-brand{font-family:'Montserrat',sans-serif;font-size:0.72rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:var(--mid);margin-bottom:0.5rem}
.prod-title{font-family:'Montserrat',sans-serif;font-size:2rem;font-weight:900;color:var(--dark);line-height:1.1;margin-bottom:0.4rem}
.prod-subtitle{font-family:'Montserrat',sans-serif;font-size:0.82rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--red);margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border)}
.prod-desc{font-size:0.92rem;line-height:1.8;color:#444;margin-bottom:2rem}
/* VARIANT SELECTOR */
.variant-block{margin-bottom:1.5rem}
.variant-label{font-family:'Montserrat',sans-serif;font-size:0.7rem;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--mid);margin-bottom:0.6rem;display:block}
.variant-options{display:flex;flex-wrap:wrap;gap:0.5rem}
.variant-btn{font-family:'Montserrat',sans-serif;font-size:0.78rem;font-weight:600;padding:0.45rem 1.1rem;border:1.5px solid var(--border);background:#fff;cursor:pointer;transition:all .2s;border-radius:2px}
.variant-btn:hover,.variant-btn.active{border-color:var(--red);color:var(--red);background:#fff8f8}
/* ACTIONS */
.prod-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border)}
/* SPEC TABLE */
.spec-section{padding:4rem 5vw;background:var(--grey);border-bottom:1px solid var(--border)}
.spec-section h2{font-family:'Montserrat',sans-serif;font-size:1.4rem;font-weight:800;color:var(--dark);margin-bottom:1.5rem}
.spec-table{width:100%;border-collapse:collapse;font-size:0.88rem}
.spec-table tr:nth-child(even){background:#efefed}
.spec-table tr:nth-child(odd){background:#fff}
.spec-table td{padding:0.7rem 1.1rem;border:1px solid var(--border)}
.spec-table td:first-child{font-family:'Montserrat',sans-serif;font-weight:700;color:var(--dark);width:35%;background:inherit}
.spec-table td:last-child{color:#444}
/* FEATURES BLOCK */
.features-section{padding:4rem 5vw;border-bottom:1px solid var(--border)}
.features-section h2{font-family:'Montserrat',sans-serif;font-size:1.4rem;font-weight:800;color:var(--dark);margin-bottom:1.5rem}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.feat-card{padding:1.75rem;border:1px solid var(--border);background:#fff;transition:border-color .2s,box-shadow .2s}
.feat-card:hover{border-color:var(--red);box-shadow:0 4px 16px rgba(139,0,0,.07)}
.feat-card__icon{width:40px;height:40px;background:#fff1f1;display:flex;align-items:center;justify-content:center;margin-bottom:1rem;border:1px solid #ffd0d0}
.feat-card__icon svg{width:20px;height:20px;stroke:var(--red);fill:none;stroke-width:2}
.feat-card__title{font-family:'Montserrat',sans-serif;font-size:0.88rem;font-weight:700;color:var(--dark);margin-bottom:0.4rem}
.feat-card__desc{font-size:0.82rem;color:var(--mid);line-height:1.65}
/* CONTACT CTA */
.cta-strip{background:var(--dark);padding:3rem 5vw;display:grid;grid-template-columns:1fr auto;align-items:center;gap:3rem}
.cta-strip__text h3{font-family:'Montserrat',sans-serif;font-size:1.3rem;font-weight:800;color:#fff;margin-bottom:0.3rem}
.cta-strip__text p{font-size:0.88rem;color:#888}
.cta-strip__btns{display:flex;gap:1rem;flex-shrink:0}
/* FOOTER */
.footer{background:var(--dark);border-top:3px solid var(--red);padding:4rem 5vw 2rem}
.footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:3rem;padding-bottom:3rem;border-bottom:1px solid #1e1e1e;margin-bottom:1.75rem}
.footer__logo{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.1rem;color:#fff;letter-spacing:0.04em;margin-bottom:0.75rem}
.footer__logo span{color:#E57373}
.footer__desc{font-size:0.83rem;color:#555;line-height:1.75;max-width:220px}
.footer__col-title{font-family:'Montserrat',sans-serif;font-size:0.68rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:#fff;margin-bottom:1.1rem}
.footer__links{list-style:none;display:flex;flex-direction:column;gap:0.5rem}
.footer__links a{font-size:0.83rem;color:#555;transition:color .2s}.footer__links a:hover{color:var(--red)}
.footer__links li{font-size:0.83rem;color:#555}
.footer__bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.footer__copy{font-size:0.75rem;color:#333}
.footer__uae{font-size:0.75rem;font-weight:600;color:#E57373;letter-spacing:0.06em}
@media(max-width:900px){.prod-hero{grid-template-columns:1fr}.prod-hero__gallery{border-right:none}.feat-grid{grid-template-columns:1fr 1fr}.cta-strip{grid-template-columns:1fr}.footer__grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.topbar{display:none}.nav__links{display:none}.feat-grid{grid-template-columns:1fr}.footer__grid{grid-template-columns:1fr}}
