*{box-sizing:border-box}
html,body{margin:0;width:100%;min-height:100%;font-family:"Noto Sans Arabic","Tahoma","Arial",sans-serif;color:#004f45}
body{background:#eef6f4}
button,input{font:inherit}
.hero{position:relative;width:100%;height:100vh;min-height:760px;overflow:hidden;background:url("./assets/hero-bg.png") center center/cover no-repeat}
.content{position:absolute;z-index:4;top:8px;left:50%;transform:translateX(-50%);width:600px;text-align:center}
.brand{display:block;width:455px;height:185px;object-fit:contain;margin:-8px auto -10px}
.copy h1{font-size:58px;line-height:1.05;margin:0;font-weight:900;letter-spacing:-1.8px}
.redline{width:100px;height:4px;border-radius:5px;background:#ed1c2e;margin:12px auto 17px}
.copy h2{font-size:23px;line-height:1.3;margin:0 0 8px;font-weight:800}
.copy p{margin:0 auto 17px;font-size:17px;line-height:1.5;color:#4e5f67;font-weight:500}
.features{width:520px;margin:0 auto 17px;display:grid;grid-template-columns:repeat(4,1fr);direction:rtl}
.features>div{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:12px;font-weight:800}
.features>div:not(:last-child):after{content:"";position:absolute;left:-1px;top:18px;width:1px;height:44px;background:#c7d5d2}
.features img{width:72px;height:72px;object-fit:contain}
.countdown{width:450px;height:94px;margin:0 auto 19px;padding:11px 8px;display:grid;grid-template-columns:repeat(4,1fr);background:rgba(255,255,255,.95);border-radius:16px;box-shadow:0 8px 24px rgba(0,61,52,.09)}
.countdown div{display:flex;flex-direction:column;justify-content:center;position:relative}
.countdown div:not(:last-child):after{content:"";position:absolute;left:0;top:12px;height:50px;width:1px;background:#a9c0bb}
.countdown strong{font-size:28px;line-height:1;font-weight:900}
.countdown span{margin-top:7px;font-size:11px;color:#687875}
.subscribe h3{margin:0 0 9px;font-size:15px;font-weight:900}
.subscribe form{width:450px;height:47px;margin:auto;display:flex;direction:rtl;background:white;border:4px solid white;border-radius:30px;box-shadow:0 4px 18px rgba(0,67,56,.09)}
.subscribe input{min-width:0;flex:1;border:0;outline:0;background:transparent;padding:0 19px;text-align:right;color:#53615f;font-size:13px}
.subscribe button{width:150px;border:0;border-radius:24px;background:#08725f;color:white;font-size:13px;font-weight:800;cursor:pointer}
.subscribe button:disabled{opacity:.6}
.consent{width:450px;margin:7px auto 0;display:flex;justify-content:center;align-items:center;gap:7px;color:#71807d;font-size:9px}
.consent input{width:13px;height:13px;margin:0}
#status{height:13px;margin:3px 0 0;font-size:10px}
.social{margin-top:2px;display:flex;direction:ltr;justify-content:center;gap:12px}
.social a{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#00594d;color:white;text-decoration:none;font-family:Arial,sans-serif;font-size:15px;font-weight:800}
.lang{position:absolute;z-index:8;right:4.4%;top:27px;display:flex;direction:ltr;align-items:center;gap:9px;font-family:Arial,sans-serif}
.lang button{padding:3px 2px;border:0;background:none;color:#5c6867;font-size:12px;font-weight:700;cursor:pointer}
.lang button.active{color:#00594d;border-bottom:2px solid #00594d}
.lang span{font-size:12px;color:#8b9694}
.left-note{position:absolute;z-index:3;left:5.5%;top:11%;transform:rotate(-8deg);font-family:"Noto Naskh Arabic","Noto Sans Arabic",serif;font-size:25px;line-height:1.6;color:#233d3a;text-align:right}
.left-note span{color:#ed1c2e;font-size:39px}
.right-note{position:absolute;z-index:3;right:5.2%;top:29%;display:flex;flex-direction:column;gap:8px;color:#7fb0a5;font-size:20px;font-weight:600;text-align:right}
footer{position:absolute;z-index:5;left:0;right:0;bottom:0;height:147px;padding:64px 4.7% 20px;display:flex;direction:ltr;justify-content:space-between;align-items:flex-end;color:#fff;background:#00594d;clip-path:polygon(0 26%,12% 12%,29% 30%,46% 68%,62% 78%,76% 64%,89% 27%,100% 7%,100% 100%,0 100%)}
.footer-left{direction:rtl;text-align:right;display:flex;flex-direction:column;gap:2px}
.footer-left strong{font-size:14px}.footer-left span{font-size:13px}.footer-left small{font-family:Arial,sans-serif;font-size:10px}
.footer-right{direction:rtl;display:flex;align-items:center;gap:18px;font-size:11px;font-weight:700}
.footer-right i{width:1px;height:17px;background:rgba(255,255,255,.45)}
.footer-right span:first-child{padding-bottom:7px;border-bottom:3px solid #ed1c2e}
html[dir="ltr"] .copy p,html[dir="ltr"] .subscribe input{text-align:center}
@media(max-width:1000px){
 .hero{height:auto;min-height:100vh;background-position:38% center}
 .content{position:relative;top:auto;left:auto;transform:none;width:min(92%,600px);margin:0 auto;padding:68px 0 190px}
 .brand{width:320px;height:138px}
 .left-note,.right-note{display:none}
 .lang{top:17px;right:20px}
 footer{height:155px}
}
@media(max-width:600px){
 .content{width:94%;padding-top:60px}
 .brand{width:270px;height:120px;margin-bottom:3px}
 .copy h1{font-size:43px}
 .copy h2{font-size:19px}
 .copy p{font-size:14px}
 .features{width:100%;gap:3px}
 .features img{width:58px;height:58px}
 .features>div{font-size:9px}
 .countdown,.subscribe form,.consent{width:96%}
 .countdown{height:82px}
 .countdown strong{font-size:23px}
 .subscribe button{width:125px;font-size:11px}
 .footer-right{display:none}
}


.whatsapp-banner{display:block;width:420px;max-width:92%;margin:8px auto 0;text-decoration:none;transition:transform .18s ease,filter .18s ease}
.whatsapp-banner img{display:block;width:100%;height:auto;object-fit:contain}
.whatsapp-banner:hover{transform:translateY(-2px) scale(1.01);filter:brightness(1.03)}
@media(max-width:1000px){.brand{width:410px;height:170px}}
@media(max-width:600px){.brand{width:330px;height:145px}.whatsapp-banner{width:330px}}

.copy h2{max-width:560px;margin-left:auto;margin-right:auto}
@media(max-width:600px){.copy h2{font-size:18px;line-height:1.5}}
