/* Template tarteel. */
:root{--fb:'Noto Kufi Arabic';--fh:'Reem Kufi';--bg:#F7F4EC;--ink:#0E1A33;--ink2:#56607A;--line:#E2D9C0;--acc:#B08A2E;--gold:#D4AF4F;--navy:#0F1F3D;--nav-bg:rgba(15,31,61,.97);--nav-solid:#0F1F3D;--demo-bg:#B08A2E;--r-in:4px;--po-bg:#0F1F3D;--po-acc:#D4AF4F}
body{font-size:15.5px}
.tarteel .nav{color:#fff;border-bottom:1px solid rgba(212,175,79,.35)}.tarteel .links a:hover{color:var(--gold)}.tarteel .links a{border-color:rgba(255,255,255,.12)}
.tarteel .btn{border-radius:2px}.tarteel .cta,.tarteel .b1,form .btn{background:var(--gold);color:var(--navy)}
.tarteel .b2{background:transparent;color:#fff;border:1px solid rgba(212,175,79,.7)}
.sec-h h2{font-size:36px;color:var(--navy)}.kick{color:var(--acc);letter-spacing:.3px}
.sec-h h2::after{content:"";display:block;width:70px;height:14px;margin-top:12px;background:url(img/pattern.svg) center/28px;opacity:.9}
.tr-hero{background:var(--navy);color:#fff;position:relative;padding:64px 0 76px}
.tr-hero::before,.tr-hero::after{content:"";position:absolute;inset-inline:0;height:22px;background:url(img/pattern.svg) 0 0/44px;opacity:.55}
.tr-hero::before{top:0}.tr-hero::after{bottom:0}
.tr-in{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.tr-k{display:inline-block;border-block:1px solid var(--gold);color:var(--gold);padding:4px 2px;font-size:14px}
.tr-hero h1{font-size:56px;font-weight:700;margin:18px 0}.tr-hero h1 em{font-style:normal;color:var(--gold)}
.tr-t>p{color:#C2CADB;font-size:17px;max-width:540px}
.hero-b{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0}
.tr-st{display:flex;gap:12px;flex-wrap:wrap}.tr-st div{border:1px solid rgba(212,175,79,.45);padding:10px 18px;min-width:110px}
.tr-st b{display:block;font-family:var(--fh);font-size:30px;color:var(--gold);line-height:1.2}.tr-st span{font-size:13px;color:#C2CADB}
.tr-v{display:grid;place-items:center}
.tr-ring{width:min(420px,100%);aspect-ratio:1;border-radius:50%;padding:12px;border:2px solid var(--gold);outline:1px solid rgba(212,175,79,.4);outline-offset:10px}
.tr-ring img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.tr-g{grid-template-columns:repeat(2,1fr);gap:16px}
.tr-c{display:flex;gap:18px;align-items:flex-start;background:#fff;border:1px solid var(--line);padding:22px;position:relative}
.tr-c::before{content:"";position:absolute;top:-1px;inset-inline-start:-1px;width:26px;height:26px;border-top:3px solid var(--gold);border-inline-start:3px solid var(--gold)}
.tr-n{flex:none;width:46px;height:46px;display:grid;place-items:center;transform:rotate(45deg);background:var(--navy);margin:6px}
.tr-n span{transform:rotate(-45deg);color:var(--gold);font-family:var(--fh);font-size:20px}
.tr-c h3{font-size:21px;color:var(--navy)}.tr-c p{margin:4px 0 6px;color:var(--ink2)}
.tr-c .ag{font-size:12px;color:var(--acc);border:1px solid var(--line);padding:1px 10px}
.tr-ig{grid-template-columns:repeat(3,1fr)}
.tr-i{display:flex;gap:14px;background:var(--navy);color:#fff;padding:22px}.tr-i .i{width:30px;height:30px;color:var(--gold)}
.tr-i h3{font-size:19px}.tr-i p{margin:4px 0 0;color:#C2CADB;font-size:15px}
.about{background:#fff}.ab-v{border-radius:0;min-height:320px;outline:1px solid var(--gold);outline-offset:-14px}
.vm div{border-radius:0;border-inline-start-color:var(--gold)}
.ben{background:#fff}.bc{border-radius:0;border-top:3px solid var(--gold)}.quote{color:var(--navy)}
.ticks .i{color:var(--acc)}
.season{background:var(--navy);color:#fff}.season .sec-h h2{color:#fff}.season .sec-h p{color:#C2CADB}
.tl>div{background:rgba(255,255,255,.04);border-color:rgba(212,175,79,.35);border-radius:0}.tl small{color:var(--gold)}.tl p{color:#C2CADB}
.tl .now{background:var(--gold);border-color:var(--gold)}.tl .now h3{color:var(--navy)}.tl .now small,.tl .now p{color:var(--navy)}
.fq{background:var(--bg)}.faqs details{border-radius:0}
.bk{background:#fff}.bk form{border-radius:0;border-top:3px solid var(--gold)}
.ct{background:var(--bg)}.soc a{border-radius:0}
footer{background:var(--navy);color:#9AA6C0;border-top:3px solid var(--gold)}
@media (max-width:900px){.tr-in{grid-template-columns:1fr}.tr-hero h1{font-size:38px}.tr-g,.tr-ig{grid-template-columns:1fr}.sec-h h2{font-size:30px}.tr-st div{min-width:0;flex:1}.tr-ring{width:min(320px,100%)}}
.bk-in>*,.bk form label{min-width:0}.bk input,.bk select,.bk textarea{width:100%;min-width:0;max-width:100%}