/* home.css - home page sections (sections/home-*.php): timeline, find-cta, different, direct, featured, dark-feature, customers, faq, banner.
   Arabic mirroring: the timeline uses CSS grid so it flips automatically with dir=rtl; extra tweaks in rtl.css */
/* offset-shadow button used on home */
.btn-offset{background:var(--o);color:#fff;border:2px solid var(--b);border-radius:8px;box-shadow:3px 3px 0 var(--b);padding:.85em 1.9em;font-size:.75rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.btn-offset:hover{background:var(--o-dark);border-color:var(--b);transform:translate(1px,1px);box-shadow:2px 2px 0 var(--b)}
.hero .btn-offset{font-size:.85rem}
/* timeline */
.tl{background:var(--bg);padding-bottom:20px}
.tl-head h2{font-weight:700;margin-bottom:.6em}
.tl-head p{color:var(--muted);font-size:.9rem;line-height:1.8}
.tl-wrap{position:relative;width:min(1000px,100% - 32px);margin:46px auto 0}
.tl-wrap::before{content:'';position:absolute;top:0;bottom:-20px;inset-inline-start:50%;width:1px;background:var(--line);transform:translateX(-.5px)}
.tl-row{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:0 70px;padding:0 0 70px}
.tl-card{grid-column:2;grid-row:1;max-width:340px;justify-self:start}
.tl-art{grid-column:1;grid-row:1;justify-self:center;opacity:.95}
.tl-art img{width:min(300px,100%);height:auto}
.tl-row.alt-row .tl-card{grid-column:1;justify-self:end}
.tl-row.alt-row .tl-art{grid-column:2}
.tl-node{position:absolute;top:50%;inset-inline-start:50%;width:18px;height:18px;border-radius:50%;background:var(--bg);border:1px solid var(--line);transform:translate(-50%,-50%);margin-top:-35px;display:grid;place-items:center}
.tl-node::after{content:'';width:5px;height:5px;border-radius:50%;background:var(--o)}
[dir=rtl] .tl-node{transform:translate(50%,-50%)}
.tl-card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 14px rgba(59,31,20,.1);width:100%}
.tl-img{position:relative;display:block;background:var(--alt)}.tl-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.tl-img .pc-badge{position:absolute;top:10px;inset-inline-start:10px;font-size:.55rem;padding:2px 9px}
.tl-b{padding:14px 14px 12px;display:flex;flex-direction:column;gap:9px}
.tl-b h3{margin:0;font-size:1.05rem;line-height:1.3}.tl-b h3 a{text-decoration:none}
.tl-desc{margin:0;font-size:.74rem;color:var(--muted);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tl-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.tl-facts div{background:#FDF1DC;border:1px solid #f3dcb2;border-radius:7px;padding:5px 7px;min-width:0}
.tl-facts small{display:block;font-size:.5rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--o-dark)}
.tl-facts b{display:block;font-size:.68rem;font-weight:600;line-height:1.3;color:var(--b);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tl-more{text-align:center;font-size:.68rem;color:var(--b);text-decoration:none;padding-top:2px}.tl-more:hover{color:var(--o)}
@media(max-width:820px){
  .tl-wrap::before{inset-inline-start:14px}
  .tl-row,.tl-row.alt-row{grid-template-columns:1fr;padding:0 0 40px 0;padding-inline-start:40px}
  .tl-row .tl-card,.tl-row.alt-row .tl-card{grid-column:1;justify-self:center;max-width:420px}
  .tl-art{display:none}
  .tl-node{inset-inline-start:14px;margin-top:0;top:30px;transform:translate(-50%,-50%)}[dir=rtl] .tl-node{transform:translate(50%,-50%)}
}
/* find cta */
.findcta{padding:10px 0 50px}
/* different */
.diff{background:var(--bg);padding-top:20px}
.diff-in{width:min(700px,100% - 32px)}
.diff h2{text-align:center;font-size:1.5rem;font-weight:700;margin-bottom:1em}
.diff p{font-size:.85rem;color:var(--text);line-height:1.8}
.diff-list{list-style:none;padding:0;margin:0 0 1em;display:grid;gap:12px}
.diff-list li{position:relative;padding-inline-start:20px;font-size:.85rem;line-height:1.75;color:var(--text)}
.diff-list li::before{content:'';position:absolute;inset-inline-start:2px;top:.7em;width:7px;height:7px;border-radius:50%;background:var(--o)}
.diff-list b{color:var(--b)}
/* direct */
.direct{padding:70px 0}
.direct-grid{display:grid;gap:34px;align-items:center}
@media(min-width:860px){.direct-grid{grid-template-columns:1fr 1fr;gap:70px}}
.direct h2{font-size:clamp(1.9rem,4vw,2.7rem);font-weight:700;line-height:1.15;margin-bottom:.8em}
.direct-t p{font-size:.88rem;color:var(--text);line-height:1.85}
.direct-t .btn{margin-top:8px}
.carriers{margin-top:20px}.carriers b{display:block;font-size:.72rem;margin-bottom:8px}
.carriers div{display:flex;gap:26px;align-items:center;flex-wrap:wrap}.carriers span{font-weight:800;font-style:italic;color:#9b9b9b;font-size:1.05rem;letter-spacing:.02em}
.direct-img{position:relative;border-radius:22px;overflow:hidden;box-shadow:0 14px 34px rgba(59,31,20,.22)}
.direct-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.pill-loc{position:absolute;top:14px;inset-inline-end:14px;display:inline-flex;gap:6px;align-items:center;background:#fff;border-radius:999px;padding:5px 14px 5px 10px;font-size:.7rem;font-weight:700;text-decoration:none;color:var(--b);box-shadow:0 2px 8px #0002}.pill-loc .ic{width:13px;height:13px}
/* featured */
.featured{padding:20px 0 50px}.featured h2{font-size:1.5rem;color:var(--b)}
.featured-row{display:flex;justify-content:center;align-items:center;gap:44px;flex-wrap:wrap;margin-top:22px}
.featured-row span{font-weight:800;color:#6b6b6b;font-size:1.1rem;letter-spacing:.02em}.featured-row a{text-decoration:none}.featured-row img{height:34px;width:auto;filter:grayscale(1);opacity:.85}
/* dark feature */
.darkf{background:#4a2a1c;color:#f3e6d9;padding:70px 0}
.darkf-grid{display:grid;gap:34px;align-items:center}
@media(min-width:880px){.darkf-grid{grid-template-columns:1.1fr .9fr;gap:80px}}
.darkf h2{color:#fff;font-size:clamp(1.7rem,3.6vw,2.4rem);line-height:1.2}
.darkf p{font-size:.85rem;line-height:1.85;color:#e3d2c4}.darkf strong{color:#fff}
.darkf .btn{margin-top:6px;box-shadow:3px 3px 0 #1d0e08;border-color:#1d0e08}
.pills{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.pills li{display:flex;align-items:center;gap:14px;background:#ffffff12;border:1px solid #ffffff1c;border-radius:12px;padding:12px 16px;font-size:.82rem;color:#f7ece2}
.pill-ic{flex:none;width:30px;height:30px;border-radius:50%;background:var(--o);color:#fff;display:grid;place-items:center}.pill-ic .ic{width:15px;height:15px}
/* instagram reels */
.ig{padding:50px 0}.ig h2{font-size:1.5rem;max-width:20em;margin-inline:auto}
.ig-intro{font-size:.82rem;color:var(--muted);max-width:44em;margin:0 auto 24px}
.ig-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.ig-c{position:relative;flex:0 0 min(200px,44%);aspect-ratio:9/16;border-radius:14px;overflow:hidden;background:linear-gradient(160deg,#d9a35a,#6b3b1f);text-decoration:none;color:#fff;display:block;box-shadow:0 4px 16px rgba(59,31,20,.18)}
.ig-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ig-c::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 55%,#000b)}
.play{position:absolute;top:50%;inset-inline-start:50%;width:42px;height:42px;border-radius:50%;background:#ffffffd9;transform:translate(-50%,-50%);z-index:1}[dir=rtl] .play{transform:translate(50%,-50%)}
.play::after{content:'';position:absolute;top:50%;left:54%;border:8px solid transparent;border-left:12px solid #3B1F14;border-right:0;transform:translate(-50%,-50%)}
.ig-meta{position:absolute;z-index:1;inset-inline:10px;bottom:10px;text-align:start;display:flex;flex-direction:column;gap:3px;font-size:.78rem}
.ig-meta em{font-style:normal;background:#ffffff38;border-radius:5px;padding:1px 7px;font-size:.6rem;width:fit-content;letter-spacing:.05em}
.ig-meta small{font-size:.66rem;opacity:.9;line-height:1.35}
.ig-c:hover{transform:translateY(-3px)}.ig-c{transition:transform .15s}
.igbox{border:0;border-radius:14px;padding:0;background:#000;max-width:min(420px,94vw);width:100%}.igbox::backdrop{background:#000b}
.igbox video{width:100%;max-height:78vh;display:block}.igbox a{display:block;text-align:center;color:#fff;padding:10px;font-size:.85rem}
.igbox-x{position:absolute;top:6px;inset-inline-end:10px;z-index:2;background:#0008;color:#fff;border:0;border-radius:50%;width:34px;height:34px;font-size:1.4rem;cursor:pointer}
/* faq */
.hfaq{background:radial-gradient(circle at 100% 20%,#8a5a30 0,#4a2a1c 28%,#2d170f 80%);color:#f3e6d9;padding:70px 0 80px}
.hfaq-k{font-size:.62rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#f0a63a;margin-bottom:10px}
.hfaq h2{color:#fff;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:400}
.hfaq-intro{font-size:.82rem;color:#d9c3b2;max-width:36em;margin:0 auto 26px}
.hfaq-box{background:#ffffff12;border:1px solid #ffffff18;border-radius:16px;padding:6px 8px;text-align:start;margin-top:26px}
.hfaq details{background:transparent;border:0;border-bottom:1px solid #ffffff14;border-radius:0;margin:0;padding:0 14px}.hfaq details:last-child{border-bottom:0}
.hfaq summary{color:#fff;font-family:var(--font);font-weight:400;font-size:.9rem;padding:14px 0;align-items:center}
.hfaq summary::after{content:none}.hfaq summary .ic{width:16px;height:16px;transition:transform .2s;color:#d9c3b2}.hfaq details[open] summary .ic{transform:rotate(180deg)}
.hfaq details div{padding-bottom:12px;font-size:.82rem;color:#d9c3b2}.hfaq details p{color:#d9c3b2;margin:0 0 .6em}
/* banner */
.hbanner{padding:56px 0 70px}
.hbanner-box{display:grid;border-radius:20px;overflow:hidden;background:#1e1a17;box-shadow:0 14px 34px rgba(0,0,0,.25);max-width:900px;margin-inline:auto}
@media(min-width:760px){.hbanner-box{grid-template-columns:1fr 1fr}}
.hbanner-box img{width:100%;height:100%;min-height:220px;object-fit:cover}
.hbanner-t{padding:30px 32px;color:#e6dcd2;align-self:center}
.hbanner-k{font-size:.58rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#f0a63a;margin-bottom:8px}
.hbanner h2{color:#fff;font-size:1.35rem;line-height:1.25}
.hbanner-t p{font-size:.78rem;color:#cfc3b8}
.hbanner .btn{border-color:#fff;box-shadow:2px 2px 0 #000a;background:var(--o)}
.diff-list b::after{content:" :"}