@import url('https://fonts.googleapis.com/css2?family=Aref+Ruqaa:wght@400;700&family=Outfit:wght@300;400;500;600&display=swap');
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:650px;background-position:center 45%;background-size:cover;padding-block:12px}
.hero:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,28,25,.2),rgba(0,28,25,.48) 50%,rgba(0,28,25,.2)),radial-gradient(ellipse at 50% 35%,rgba(255,255,239,.1),transparent 38%)}
.hero:after{z-index:0}.hero-copy{position:relative;z-index:1;width:min(92%,980px);padding:24px 0 36px;display:flex;flex-direction:column;align-items:center;text-align:center}
.calligraphy{position:relative;isolation:isolate;display:grid;place-items:center;flex:none;width:300px;height:300px;border:0;border-radius:0;background:none;box-shadow:none;margin:-20px auto -8px;text-shadow:none;animation:sealArrival 1.7s cubic-bezier(.2,.7,.2,1) both}
.calligraphy:before,.calligraphy:after{content:none}.medallion-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.medallion-text{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#f7d990;font-family:'Aref Ruqaa',Amiri,serif;font-weight:400;line-height:1.1;transform:translateY(-4px);text-shadow:0 1px 1px #8c6429,0 0 22px #dbb95644}
.medallion-text>span:first-child{font-size:35px}.medallion-text>span:nth-child(2){font-size:42px;margin-top:2px}.medallion-text small{font:13px Amiri,serif;color:#f1dbac;margin-top:12px}
.hero h1{font-family:Outfit,Arial,sans-serif;font-size:clamp(40px,4.7vw,62px);line-height:1.12;letter-spacing:1px;font-weight:300;margin:4px 0 22px;animation:heroArrival 1.4s .3s both}
.hero h1 em{display:block;font-family:Outfit,Arial,sans-serif;font-size:.97em;font-style:normal;font-weight:500;color:#f1cc80;letter-spacing:.12em;margin-top:10px;text-transform:uppercase;background:linear-gradient(110deg,#c59143 0%,#f2cf88 32%,#fff9e9 45%,#f2cf88 56%,#c59143 80%);background-size:250% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:titleLight 5s ease-in-out infinite}
.hero p{position:relative;font-family:Inter,Arial,sans-serif;font-size:15px;font-weight:400;letter-spacing:1.2px;line-height:1.6;margin:0;padding-top:18px;color:#eeeadd;animation:heroArrival 1.4s .55s both}
.hero p:before{content:"";position:absolute;width:100px;height:1px;top:0;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#e1b769,transparent)}
html[dir=rtl] .hero h1{font-family:'Aref Ruqaa',Amiri,serif;font-size:clamp(42px,4.8vw,64px);font-weight:400;letter-spacing:0;line-height:1.3}html[dir=rtl] .hero h1 em{font-family:inherit;font-style:normal;line-height:1.1;margin-top:0}html[dir=rtl] .hero p{font-family:Amiri,serif;font-size:19px;letter-spacing:0}
@keyframes sealArrival{from{opacity:0;transform:scale(.97);filter:blur(5px)}to{opacity:1;transform:scale(1);filter:blur(0)}}
@keyframes heroArrival{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.hero{min-height:620px}.calligraphy{width:280px;height:280px}.hero-copy{padding-top:32px}.hero h1{font-size:48px}.hero p{font-size:13px;letter-spacing:.5px}html[dir=rtl] .hero h1{font-size:43px}}

.medallion-art{z-index:1}.medallion-text{z-index:2}.white-fire{position:absolute;inset:-28%;width:156%;height:156%;z-index:0;pointer-events:none;mix-blend-mode:screen}
@keyframes titleLight{0%,100%{background-position:100% 50%}50%{background-position:0% 50%}}
html[dir=rtl] .hero h1 em{text-transform:none;letter-spacing:0}
@media(prefers-reduced-motion:reduce){.calligraphy,.hero h1,.hero h1 em,.hero p{animation:none}.white-fire{display:none}}