*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:#f8f9fa;color:#102839;font-family:Tahoma,Arial,sans-serif;font-size:16px;line-height:1.8}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid #d2ae64;outline-offset:5px}header{height:100px;display:flex;align-items:center;justify-content:space-between;padding:0 6%;background:#fff;border-bottom:1px solid #e6eaed}.brand{display:flex;gap:12px;align-items:center;font-size:24px;font-weight:bold}.brand small{display:block;font-size:12px;letter-spacing:1px;font-weight:normal}.brand-mark{border:1px solid #b89450;border-radius:50%;color:#b89450;width:48px;height:48px;display:grid;place-items:center;font-family:serif;font-size:34px}nav{display:flex;gap:36px;font-size:14px}nav a:hover{color:#9a7333}.header-note{font-size:12px;letter-spacing:2px;color:#73808a}.hero{display:grid;grid-template-columns:1fr 1fr;background:#0c2234;color:white;min-height:650px;padding:45px 6%;gap:5vw;align-items:center}.hero-copy{padding-block:30px}.eyebrow{color:#b89450;font-size:14px;display:block;margin-bottom:18px}.hero h1{font-size:clamp(38px,4.4vw,66px);line-height:1.55;margin:0 0 20px;letter-spacing:-1px}em{font-style:normal;color:#d4b575}.hero p{color:#c4ced6;margin-bottom:30px;line-height:2.1}.primary{display:inline-flex;align-items:center;gap:45px;padding:13px 24px;background:#d4b575;color:#102839;font-weight:bold;font-size:14px}.primary:hover{background:#e5c78c}.hero-foot{margin-top:48px;display:flex;gap:15px;align-items:center;color:#c4ced6;font-size:12px}.hero-foot i{width:3px;height:3px;border-radius:50%;background:#b89450}.slideshow{max-width:490px;width:100%;justify-self:center}.slide-stage{height:550px;background:#061726;display:flex;align-items:center;justify-content:center;border:1px solid #304251}.slide{height:100%;width:100%;object-fit:contain}.slide[hidden]{display:none}.slide-controls{display:flex;justify-content:space-between;align-items:center;padding-top:18px;color:#c8d0d6}.dots{display:flex;gap:9px}.dots button{width:26px;height:26px;border:0;background:transparent;padding:8px}.dots button:before{content:'';display:block;width:10px;height:10px;border:1px solid #bfab81;border-radius:50%}.dots .selected:before{background:#d4b575}.slide-controls>button{font-size:12px;background:none;border:0;color:#c8d0d6}.slide-number{font-size:12px;direction:ltr}.collections{padding:85px 6% 90px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:30px}.section-head .eyebrow{margin:0}h2{font-size:32px;line-height:1.6;margin:8px 0 0}.section-head p{color:#6b7780;font-size:14px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.category{height:470px;position:relative;overflow:hidden;display:block;background:#122938}.category>img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.category:first-child>img{object-position:50% 62%}.category:hover>img{transform:scale(1.04)}.category>div{position:absolute;inset:0;padding:26px;display:flex;justify-content:end;flex-direction:column;background:linear-gradient(transparent 35%,rgba(4,17,27,.94));color:white}.count{position:absolute;top:20px;right:24px;font-size:14px;text-shadow:0 1px 5px black}.category h3{font-size:25px;margin:0 0 6px}.explore{font-size:13px;color:#e0c58e}.about{padding:65px 9%;background:#102839;color:white}.about>div{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px}.about h2{font-size:30px}.about p{color:#c4ced6;line-height:2.2;max-width:510px}.contact{text-align:center;padding:70px 6%;background:#edf1f4}.contact .eyebrow{margin-bottom:8px}.contact p{color:#697984}.contact a{display:inline-block;margin:8px;padding:10px 24px;background:#102839;color:#fff}footer{padding:30px 6%;display:flex;justify-content:space-between;align-items:center;gap:20px;background:white;font-size:13px}footer>span{font-size:19px;font-weight:bold}footer small{display:block;font-size:12px;font-weight:normal}footer p{color:#75818a}dialog{border:0;padding:40px;max-width:860px;width:90vw;max-height:90vh;background:#f8f9fa;color:#102839;overflow:auto}dialog::backdrop{background:rgba(3,14,24,.8)}.close{position:absolute;left:15px;top:8px;border:0;background:transparent;font-size:36px}.gallery-heading{text-align:center}.gallery-heading p{color:#697984}.gallery-heading .eyebrow{margin-bottom:0}#gallery-image{display:block;max-width:100%;max-height:65vh;margin:20px auto;object-fit:contain}.gallery-contact{display:block;text-align:center;padding:12px;background:#102839;color:white}body.modal-open{overflow:hidden}@media(max-width:800px){header{padding:15px 5%;height:auto;flex-wrap:wrap;gap:15px}.brand{font-size:20px}.header-note{display:none}nav{gap:18px;font-size:13px}.hero{grid-template-columns:1fr;padding:30px 6%;gap:20px}.hero-copy{padding:0}.hero h1{font-size:39px}.hero p{font-size:14px}.hero-foot{margin-top:25px}.slide-stage{height:460px}.slideshow{max-width:420px}.collections{padding:50px 6%}.section-head{display:block}.cards{grid-template-columns:1fr;gap:22px}.category{height:430px}.category>img{object-position:center 60%}.about{padding:40px 6%}.about>div{grid-template-columns:1fr;gap:10px}h2{font-size:27px}.contact{padding:45px 6%}footer{flex-wrap:wrap}.contact h2{font-size:24px}dialog{padding:30px 18px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Full-width continuously moving image ribbon. */
.hero{display:flex;flex-direction:column;padding:0;gap:0;min-height:0;align-items:stretch}
.slideshow{order:-1;max-width:none;width:100%;overflow:hidden}
.slide-stage{height:clamp(530px,54vw,780px);display:block;overflow:hidden;border:0;direction:ltr;background:#071c2c}
.carousel-track{height:100%;display:flex;width:max-content;gap:18px;will-change:transform;direction:ltr}
.carousel-track .slide{height:100%;width:auto;aspect-ratio:1055/1491;object-fit:contain;flex:none;display:block}
.slide-controls{padding:15px 6%;border-bottom:1px solid #304251}
.hero-copy{padding:36px 6% 42px;display:grid;grid-template-columns:1fr 1fr;column-gap:60px;align-items:center}
.hero-copy .eyebrow{grid-column:1/-1;margin-bottom:8px}
.hero h1{font-size:clamp(32px,3.7vw,52px);margin:0;grid-row:2/4}
.hero p{margin:0 0 20px}.hero .primary{justify-self:start}.hero-foot{grid-column:1/-1;margin-top:24px}
@media(max-width:800px){.slide-stage{height:570px}.carousel-track{gap:12px}.hero-copy{display:block;padding:26px 6% 30px}.hero h1{font-size:33px;margin-bottom:12px}.hero p{margin-bottom:18px}.slide-controls{padding:12px 6%}.hero-foot{margin-top:24px}}
/* Locally hosted Arabic typography. */
@font-face{font-family:Tajawal;font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/tajawal-400.ttf') format('truetype')}
@font-face{font-family:Tajawal;font-style:normal;font-weight:500;font-display:swap;src:url('assets/fonts/tajawal-500.ttf') format('truetype')}
@font-face{font-family:Tajawal;font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/tajawal-700.ttf') format('truetype')}
@font-face{font-family:Tajawal;font-style:normal;font-weight:800;font-display:swap;src:url('assets/fonts/tajawal-800.ttf') format('truetype')}
body{font-family:Tajawal,Tahoma,Arial,sans-serif;font-weight:400;line-height:1.9}
h1,h2,h3,.brand{font-weight:800;letter-spacing:0}
.hero h1{letter-spacing:0;line-height:1.5}.hero p,.about p{font-size:18px;line-height:1.95}
nav,.primary,.explore,.contact a{font-weight:500;font-size:16px}
.eyebrow,.hero-foot,.slide-controls>button{font-size:14px}
.brand{font-size:27px}.brand small{font-size:14px;letter-spacing:0;font-weight:500}
.category h3{font-size:29px;line-height:1.5}
@media(max-width:800px){.brand{font-size:23px}nav{font-size:14px}.hero p{font-size:17px}.hero h1{font-size:36px}.hero-foot{font-size:13px}}
.brand bdi{font-family:Georgia,serif;font-size:30px;letter-spacing:2px}.brand small{line-height:1.6;max-width:300px}.brand-mark{flex-shrink:0}header{min-height:100px;height:auto;padding-block:18px;gap:24px}.brand{min-width:0}@media(max-width:800px){header{gap:14px}.brand bdi{font-size:27px}.brand small{font-size:13px;max-width:250px}}
.site-logo{width:142px;height:95px;object-fit:contain;display:block;flex-shrink:0;mix-blend-mode:multiply}.brand{gap:18px}.brand small{font-size:15px;line-height:1.8}header{padding-block:10px}.header-note{display:none}@media(max-width:800px){.site-logo{width:115px;height:78px}.brand{gap:12px}.brand small{font-size:14px}header{justify-content:center}header nav{justify-content:center;flex-wrap:wrap}}
/* Subtle motion, using transforms and opacity to keep scrolling light. */
@media(prefers-reduced-motion:no-preference){
 .hero-copy,.section-head,.category,.about,.contact{transition:opacity .7s ease var(--reveal-delay,0ms),transform .7s cubic-bezier(.2,.65,.25,1) var(--reveal-delay,0ms)}
 .reveal-pending{opacity:0;transform:translateY(26px)}
 nav a{position:relative}nav a::after{content:'';position:absolute;bottom:-5px;right:0;width:100%;height:2px;background:#b89450;transform:scaleX(0);transform-origin:right;transition:transform .25s ease}nav a:hover::after,nav a:focus-visible::after{transform:scaleX(1)}
 .primary,.contact a,.gallery-contact{transition:transform .22s ease,box-shadow .22s ease,background .22s ease}
 .primary:hover,.contact a:hover,.gallery-contact:hover{transform:translateY(-3px);box-shadow:0 8px 20px #081b2926}
 .primary:active,.contact a:active,.gallery-contact:active{transform:translateY(0) scale(.98)}
 .primary span{transition:transform .25s ease}.primary:hover span{transform:translate(-4px,3px)}
 .category>img{transition:transform .8s cubic-bezier(.2,.65,.25,1)}
 .category h3,.category .explore{transition:transform .35s ease}.category:hover h3,.category:focus-visible h3{transform:translateY(-5px)}.category:hover .explore,.category:focus-visible .explore{transform:translateX(-5px)}
 .close{transition:transform .25s ease,color .25s ease}.close:hover{transform:rotate(90deg);color:#9a7333}
 dialog[open]{animation:gallery-enter .32s cubic-bezier(.2,.65,.25,1)}dialog[open]::backdrop{animation:backdrop-enter .25s ease}
 @keyframes gallery-enter{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
 @keyframes backdrop-enter{from{background:rgba(3,14,24,0)}to{background:rgba(3,14,24,.8)}}
}
@media(prefers-reduced-motion:reduce){.reveal-pending{opacity:1;transform:none}dialog,dialog::backdrop{animation:none!important}}
/* Molten iron backdrop, with scroll-linked downward flow. */
body{background:#100e0d;color:#f4eee7;isolation:isolate}.molten-scene{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#100e0d}.molten-texture{position:absolute;inset:-25vh 0;background-image:url('assets/molten-background.png');background-size:100% 100%;background-repeat:no-repeat;transform:translateY(var(--molten-shift,0px));will-change:transform;opacity:.95}.molten-flow{position:absolute;top:-100%;height:300%;width:5%;opacity:.7;background:repeating-linear-gradient(180deg,transparent 0px,#ff6b0033 130px,#ff9d00aa 240px,#fff3a8cc 270px,#ff4d0088 320px,transparent 400px,transparent 670px);filter:blur(9px);transform:translateY(var(--flow-shift,0px));will-change:transform}.molten-flow-left{left:2%}.molten-flow-right{right:2%;background-position-y:220px}header{color:#102839;background:#fff}.hero{background:transparent}.hero-copy{background:rgba(12,14,16,.84);margin:24px 6%;padding:36px 4%;border:1px solid #bf60273d}.collections{margin:0 6%;padding:65px 3% 75px;background:rgba(13,15,17,.82);border:1px solid #bf602733}.section-head p{color:#d3c6bc}.eyebrow{color:#f0b46d}.category{border:1px solid #d58c444d;box-shadow:0 12px 30px #0006}.about{margin:30px 6%;padding:45px 4%;background:rgba(16,20,24,.88);border:1px solid #c26a393d}.contact{margin:30px 6%;padding:45px 4%;background:rgba(16,20,24,.9);border:1px solid #c26a393d}.contact p{color:#d4c9bf}.contact a{background:#9c441a;color:#fff}.contact a:hover{background:#bb541e}.slide-controls{background:rgba(12,14,16,.9);border-bottom-color:#b36535}.primary{background:#eeb36c}.primary:hover{background:#ffd395}footer{background:rgba(12,14,16,.94);color:#f4eee7}footer p{color:#c1b5ad}.hero em,.about em{color:#f1b26e}dialog{color:#102839}@media(max-width:800px){.molten-texture{background-size:100% 100%;background-position:center}.molten-flow{width:6%;filter:blur(5px)}.hero-copy{margin:18px 5%;padding:26px 5%}.collections{margin:0 5%;padding:35px 5%}.about,.contact{margin:22px 5%;padding:30px 5%}}

/* Live liquid metal, rendered behind the content. */
.molten-texture{opacity:.38}.molten-flow{display:none}.molten-liquid{position:absolute;inset:0;width:100%;height:100%}
