/* Template baity. */
:root{--fb:'Almarai';--fh:'Kufam';--bg:#FFF7F0;--ink:#3D405B;--ink2:#6B6E85;--line:#EEDFD0;--acc:#E07A5F;--sage:#81B29A;--sand:#F2CC8F;--cream:#FFFDF8;--nav-bg:rgba(255,247,240,.95);--nav-solid:#FFF7F0;--demo-bg:#3D405B;--r-in:16px;--po-bg:#3D405B;--po-acc:#F2CC8F}
.nav{box-shadow:0 1px 0 var(--line)}
.brand>span{font-family:var(--fh);font-weight:800}.brand small{color:var(--acc);opacity:1;font-weight:700}
.baity .btn{border-radius:14px}
.baity .cta,.baity .b1,form .btn{background:var(--acc);color:#fff}
.baity .b1:hover,.baity .cta:hover{background:#C9654B}
.baity .b2{background:var(--cream);color:var(--ink);border:2px dashed var(--ink)}
h1,h2,h3{font-family:var(--fh);font-weight:700}
.kick{color:var(--acc);display:inline-flex;align-items:center;gap:8px}
.kick::before{content:"";width:16px;height:14px;background:var(--acc);clip-path:polygon(50% 0,100% 45%,100% 100%,0 100%,0 45%)}
.sec-h h2{font-size:38px;line-height:1.5}

/* hero */
.hero{padding:56px 0 90px;background:linear-gradient(180deg,#FCE9DA,var(--bg));overflow:hidden}
.hero-in{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.pill{display:inline-block;background:var(--cream);color:var(--acc);font-weight:700;font-size:14px;padding:6px 16px;border-radius:12px;outline:2px dashed var(--sand);outline-offset:-5px}
.hero h1{font-size:52px;line-height:1.55;margin:16px 0}
.hero h1 em{font-style:normal;color:var(--acc)}
.hero-t>p{font-size:18px;color:var(--ink2);max-width:520px;margin:0}
.hero-b{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0}
.doors{display:flex;gap:14px;flex-wrap:wrap}
.doors div{min-width:110px;text-align:center;padding:16px 12px 12px;border-radius:60px 60px 10px 10px;background:var(--sage);color:#fff}
.doors div:nth-child(2){background:var(--ink)}.doors div:nth-child(3){background:var(--acc)}
.doors b{display:block;font-family:var(--fh);font-size:26px;line-height:1.3}.doors span{font-size:13px;opacity:.92}
.home{position:relative;max-width:500px;margin:0 auto;width:100%;aspect-ratio:1/1.02;filter:drop-shadow(0 20px 30px rgba(61,64,91,.16))}
.roof{position:absolute;inset:0;background:var(--acc);clip-path:polygon(50% 0,100% 30%,94% 30%,50% 6%,6% 30%,0 30%)}
.walls{position:absolute;inset:7% 8% 0;background:center/cover;clip-path:polygon(50% 0,100% 27%,100% 100%,0 100%,0 27%);background-color:var(--cream)}
.window{position:absolute;width:38%;aspect-ratio:1;bottom:-6%;inset-inline-start:-6%;border-radius:50%;background:center/cover;border:10px solid var(--sand);box-shadow:0 18px 30px rgba(61,64,91,.18)}

/* cards */
.card{background:var(--cream);border:0;border-radius:18px;padding:24px;box-shadow:0 10px 26px rgba(61,64,91,.07)}
.houses{grid-template-columns:repeat(3,1fr);gap:26px}
.hc{display:flex;flex-direction:column;--c:var(--acc)}.h1{--c:var(--sage)}.h2{--c:var(--ink)}
.rf{display:block;height:70px;background:var(--c);clip-path:polygon(50% 0,100% 100%,0 100%);margin:0 -10px}
.hc .card{flex:1;border-radius:0 0 22px 22px;padding:26px;text-align:center;outline:2px dashed var(--line);outline-offset:-10px}
.door{display:grid;place-items:center;width:56px;height:70px;margin:-60px auto 14px;border-radius:30px 30px 6px 6px;background:var(--c);color:#fff;font-family:var(--fh);font-size:26px;border:5px solid var(--cream)}
.hc h3{font-size:23px;margin-bottom:6px}.hc p{margin:0 0 14px;color:var(--ink2)}
.hc .ag{display:inline-block;background:var(--bg);color:var(--c);font-weight:700;font-size:13px;padding:3px 14px;border-radius:99px;border:1.5px solid var(--c)}
.stitch{grid-template-columns:repeat(3,1fr)}
.stitch .card{outline:2px dashed var(--sand);outline-offset:-10px}
.stitch .ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:var(--sage);color:#fff;margin-bottom:12px}
.stitch h3{font-size:20px;margin-bottom:4px}.stitch p{margin:0;color:var(--ink2)}
.awards span,.soc a{background:var(--cream);border:2px dashed var(--line);border-radius:14px}

/* sections */
.about{background:var(--cream)}
.ab-v{min-height:420px;border-radius:0 0 24px 24px;clip-path:polygon(50% 0,100% 22%,100% 100%,0 100%,0 22%)}
.vm div{background:var(--bg);border-inline-start:4px solid var(--sage);border-radius:10px}.vm b{font-family:var(--fh)}
.season{background:var(--bg)}
.tl>div{border:0;background:var(--cream);border-radius:18px;outline:2px dashed var(--line);outline-offset:-8px;box-shadow:0 8px 20px rgba(61,64,91,.06)}
.tl small{color:var(--acc);font-family:var(--fh);font-size:16px;direction:ltr}
.tl .now{background:var(--sage);outline-color:rgba(255,255,255,.5)}.tl .now small{color:#fff}.tl .now p{color:#EEF7F2}
.why{background:var(--cream)}
.why-v{border-radius:24px;min-height:400px;border:10px solid #fff;box-shadow:0 18px 40px rgba(61,64,91,.12)}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:14px}.ticks li{display:flex;gap:12px}
.ticks .i{width:30px;height:30px;padding:6px;border-radius:10px;background:var(--acc);color:#fff}
.ticks b{display:block;font-size:17px}.ticks span{color:var(--ink2)}
.course{background:#EAF3EE}
.facts div{background:var(--cream);border-radius:14px}.facts .i{color:var(--sage)}
.learn{outline:2px dashed var(--sand);outline-offset:-10px}.learn .ticks .i{background:var(--sage)}
.baity .portal{--po-bg:#3D405B;--po-acc:#F2CC8F}.po-card{border-radius:22px}
.rv{background:var(--bg)}.rev{outline:2px dashed var(--line);outline-offset:-8px}
.gl{background:var(--cream)}.gal div{border-radius:18px;border:6px solid #fff;box-shadow:0 6px 18px rgba(61,64,91,.08)}
.fq{background:var(--bg)}.faqs details{border:0;background:var(--cream);border-radius:16px;box-shadow:0 4px 14px rgba(61,64,91,.05)}.faqs summary::after{color:var(--acc)}
.bk{background:var(--ink);color:#fff}.bk .sec-h h2{color:#fff}.bk .sec-h p{color:#D5D6E3}.bk .kick{color:var(--sand)}.bk .kick::before{background:var(--sand)}
.bk form{color:var(--ink);outline:2px dashed var(--sand);outline-offset:-10px}
input,select,textarea{border-radius:12px;border:2px solid var(--line)}
footer{background:#2E3047;color:#D5D6E3;text-align:center;border-top:8px solid var(--acc)}

@media (max-width:900px){
 .hero{padding:36px 0 70px}.hero-in{grid-template-columns:1fr;gap:40px}.hero h1{font-size:34px}
 .home{max-width:330px}.doors div{min-width:92px;padding:12px 8px 10px}.doors b{font-size:21px}
 .houses,.stitch{grid-template-columns:1fr}.sec-h h2{font-size:28px}.ab-v{min-height:300px}.why-v{min-height:280px}
}
