:root{
    --dark:#33231A;
    --dark-2:#2A1D15;
    --panel:#4A3423;
    --panel-2:#5A4130;
    --cream:#F3EAD9;
    --card-cream:#FBF7EF;
    --text-dark:#3B2A1D;
    --muted-on-dark:#CBB79B;
    --muted-on-cream:#8C7A63;
    --gold:#C79358;
    --gold-deep:#A97A44;
    --line-dark:rgba(243,234,217,0.14);
    --line-cream:rgba(59,42,29,0.14);
    --nav-h:84px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth; scroll-padding-top: calc(var(--nav-h) + env(safe-area-inset-top,0px));}
  html,body{height:100%;}
  body{
    margin:0; background:var(--cream); color:var(--text-dark);
    font-family:'Tajawal', sans-serif; font-weight:300; line-height:1.85;
    -webkit-font-smoothing:antialiased; overflow-x:hidden;
    padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
  }
  h1,h2,h3{ margin:0; font-family:'Cairo', sans-serif; font-weight:700; }
  .brand-font{ font-family:'Lalezar', sans-serif; font-weight:400; }
  .num-font{ font-family:'Playfair Display', serif; font-style:italic; }
  p{margin:0;}
  a{color:inherit; text-decoration:none;}
  ul{margin:0; padding:0; list-style:none;}
  button{font-family:inherit; cursor:pointer;}
  img{max-width:100%; display:block;}
  .wrap{max-width:1140px; margin-inline:auto; padding-inline:32px;}
  section{position:relative;}
  ::selection{background:var(--gold); color:#fff;}

  /* ---------- NAV ---------- */
  .nav{
    position:fixed; top:0; inset-inline:0; z-index:500; height:var(--nav-h);
    padding-top:env(safe-area-inset-top,0px);
    display:flex; align-items:center;
    background:var(--dark-2);
    border-bottom:1px solid var(--line-dark);
    box-shadow:0 2px 14px rgba(0,0,0,.22);
    transform:translateY(0); transition:transform .4s cubic-bezier(.4,0,.2,1);
  }
  .nav.scrolled{ background:var(--dark-2); }
  .nav.nav-hidden{ transform:translateY(-100%); }
  .nav-hover-zone{ position:fixed; top:0; inset-inline:0; height:16px; z-index:499; }
  .nav-inner{ width:100%; display:flex; align-items:center; justify-content:space-between; max-width:1140px; margin-inline:auto; padding-inline:32px; }
  .nav-brand{ display:flex; align-items:center; gap:10px; }
  .nav-brand img{width:48px; height:48px; object-fit:contain; transition:transform .4s ease;}
  .nav-brand:hover img{ transform:rotate(-8deg) scale(1.08); }
  .nav-brand span{ font-size:23px; color:var(--cream); }
  .nav-links{ display:flex; align-items:center; gap:32px; }
  .nav-links a{ font-size:14.5px; font-weight:500; color:var(--muted-on-dark); transition:color .25s; }
  .nav-links a:hover{ color:var(--cream); }
  .nav-actions{ display:flex; align-items:center; gap:14px; }
  .lang-btn{
    border:1px solid var(--line-dark); background:transparent; color:var(--cream);
    font-size:12.5px; font-weight:600; padding:8px 17px; border-radius:20px; letter-spacing:.4px;
    transition:border-color .25s, background .25s;
  }
  .lang-btn:hover{ border-color:var(--gold); background:rgba(199,147,88,.12); }
  .nav-burger{display:none; flex-direction:column; gap:5px; background:none; border:0; padding:6px;}
  .nav-burger span{width:20px; height:1.5px; background:var(--cream); display:block;}
  @media(max-width:900px){
    .nav-links{
      position:fixed; top:0; inset-inline:0; bottom:0; padding-top:120px;
      background:var(--dark); flex-direction:column; gap:30px;
      transform:translateX(100%); transition:transform .4s cubic-bezier(.4,0,.2,1); z-index:600;
    }
    [dir="rtl"] .nav-links{transform:translateX(100%);}
    [dir="ltr"] .nav-links{transform:translateX(-100%);}
    .nav-links.open{transform:translateX(0);}
    .nav-links a{font-size:20px; color:var(--cream); position:relative; z-index:2; padding:10px 22px; display:block;}
    .nav-links li{position:relative; z-index:2;}
    .nav-burger{display:flex;}
  }

  /* ---------- HERO ---------- */
  .hero{
    min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center; padding:calc(var(--nav-h) + 30px) 24px 90px;
    background:radial-gradient(ellipse at 50% 15%, var(--panel) 0%, var(--dark) 55%, var(--dark-2) 100%);
  }
  .hero-mark{ width:190px; height:auto; margin-bottom:26px; filter:drop-shadow(0 10px 24px rgba(0,0,0,.4)); animation:logoFloat 4.5s ease-in-out infinite; }
  @keyframes logoFloat{ 0%,100%{ transform:translateY(0) rotate(0deg); } 50%{ transform:translateY(-12px) rotate(-2deg); } }
  .hero-label{ font-size:15px; color:var(--muted-on-dark); letter-spacing:.5px; margin-bottom:6px; }
  .hero-word{ font-size:clamp(58px,10vw,96px); color:var(--cream); line-height:1; }
  .hero-tagline-box{ height:56px; display:flex; align-items:center; justify-content:center; margin-top:20px; }
  .hero-tagline{ font-size:clamp(24px,4vw,34px); color:var(--gold); }
  .hero-cursor{ display:inline-block; width:2px; height:.9em; background:var(--gold); margin-inline-start:3px; vertical-align:-2px; animation:blink 1s step-end infinite; }
  @keyframes blink{ 50%{ opacity:0; } }
  .hero-blurb{ max-width:600px; margin-top:26px; font-size:15.5px; color:var(--muted-on-dark); font-weight:300; }
  .hero-actions{ display:flex; gap:16px; margin-top:38px; flex-wrap:wrap; justify-content:center; }
  .btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:15px 30px; border-radius:30px; font-size:14.5px; font-weight:700; border:0; transition:transform .2s, background .25s, opacity .25s; }
  .btn:active{ transform:scale(.97); }
  .btn-gold{ background:var(--gold); color:var(--dark-2); }
  .btn-gold:hover{ background:var(--gold-deep); }
  .btn-ghost-dark{ background:transparent; color:var(--cream); border:1px solid var(--line-dark); }
  .btn-ghost-dark:hover{ border-color:var(--gold); color:var(--gold); }
  .btn-ghost-light{ background:transparent; color:var(--text-dark); border:1px solid var(--line-cream); }
  .btn-ghost-light:hover{ border-color:var(--gold-deep); color:var(--gold-deep); }
  .btn svg{width:16px; height:16px;}

  /* ---------- SECTION HEADS (right-aligned / start-aligned editorial) ---------- */
  section.pad{ padding:110px 0; }
  @media(max-width:600px){ section.pad{ padding:70px 0; } .wrap{ padding-inline:20px; } }
  section.on-dark{ background:linear-gradient(180deg, var(--dark) 0%, var(--dark-2) 100%); }
  .section-head{ max-width:560px; text-align:start; margin-bottom:56px; }
  .section-num{ display:block; font-size:56px; color:var(--gold); opacity:.55; line-height:1; margin-bottom:8px; }
  .section-title{ font-size:clamp(26px,3.6vw,38px); line-height:1.5; }
  .section-title.on-dark-text{ color:var(--cream); }
  .section-title.on-cream-text{ color:var(--text-dark); }
  .section-sub{ font-size:15px; margin-top:12px; font-weight:300; }
  .section-sub.on-dark-text{ color:var(--muted-on-dark); }
  .section-sub.on-cream-text{ color:var(--muted-on-cream); }

  /* ---------- WORKS ---------- */
  .works-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
  .work-card{ background:var(--card-cream); border-radius:14px; overflow:hidden; box-shadow:0 10px 26px rgba(59,42,29,0.08); transition:transform .3s, box-shadow .3s; }
  .work-card:hover{ transform:translateY(-4px); box-shadow:0 16px 34px rgba(59,42,29,0.14); }
  .work-visual{ position:relative; aspect-ratio:4/3; padding:18px; display:flex; flex-direction:column; gap:10px; }
  .work-visual .chrome-dots{ display:flex; gap:5px; }
  .work-visual .chrome-dots span{ width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.55); }
  .work-visual .chrome-body{ flex:1; display:flex; gap:10px; }
  .work-visual .chrome-block{ flex:1; border-radius:6px; background:rgba(255,255,255,.28); }
  .work-visual .chrome-lines{ flex:1.3; display:flex; flex-direction:column; gap:8px; justify-content:center; }
  .work-visual .chrome-lines i{ display:block; height:8px; border-radius:5px; background:rgba(255,255,255,.32); font-style:normal; }
  .work-visual .chrome-lines i:nth-child(1){width:90%;}
  .work-visual .chrome-lines i:nth-child(2){width:70%;}
  .work-visual .chrome-lines i:nth-child(3){width:45%; background:rgba(255,255,255,.5);}
  .work-badge{
    position:absolute; top:12px; inset-inline-end:14px; font-family:'Playfair Display',serif; font-style:italic;
    font-size:14px; color:rgba(255,255,255,.55);
  }
  .work-foot{ display:flex; align-items:center; justify-content:space-between; padding:18px 20px 22px; }
  .work-foot .info{ display:flex; flex-direction:column; gap:8px; }
  .work-foot .title{ font-family:'Tajawal',sans-serif; font-weight:700; font-size:16px; color:var(--text-dark); }
  .work-foot .tag{ align-self:flex-start; font-size:11.5px; padding:4px 12px; border-radius:12px; background:var(--cream); color:var(--muted-on-cream); font-weight:500; }
  .work-arrow{ width:38px; height:38px; border-radius:50%; border:1px solid var(--line-cream); display:flex; align-items:center; justify-content:center; flex:0 0 auto; color:var(--text-dark); transition:background .25s, border-color .25s, transform .25s; cursor:pointer; }
  .work-card:hover .work-arrow, .work-arrow:hover{ background:var(--gold); border-color:var(--gold); color:#fff; transform:scale(1.22); }
  .work-arrow svg{ width:15px; height:15px; }
  [dir="ltr"] .work-arrow svg{ transform:rotate(90deg); }

  /* ---------- WORK MODAL ---------- */
  .work-modal{ position:fixed; inset:0; z-index:900; display:flex; align-items:center; justify-content:center; padding:24px; opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s; }
  .work-modal.open{ opacity:1; visibility:visible; }
  .work-modal-overlay{ position:absolute; inset:0; background:rgba(42,29,21,0.6); backdrop-filter:blur(4px); }
  .work-modal-card{
    position:relative; background:var(--card-cream); border-radius:18px; max-width:480px; width:100%;
    overflow:hidden; transform:translateY(16px) scale(.97); transition:transform .35s cubic-bezier(.4,0,.2,1);
    box-shadow:0 30px 60px rgba(0,0,0,.35);
  }
  .work-modal.open .work-modal-card{ transform:translateY(0) scale(1); }
  .work-modal-visual{ aspect-ratio:16/8; }
  .work-modal-close{
    position:absolute; top:14px; inset-inline-end:14px; width:34px; height:34px; border-radius:50%;
    background:rgba(255,255,255,.85); border:0; display:flex; align-items:center; justify-content:center;
    color:var(--text-dark); font-size:20px; line-height:1; z-index:2;
  }
  .work-modal-body{ padding:28px 28px 30px; display:flex; flex-direction:column; gap:12px; }
  .work-modal-body .tag{ align-self:flex-start; font-size:11.5px; padding:4px 12px; border-radius:12px; background:var(--cream); color:var(--muted-on-cream); font-weight:500; }
  .work-modal-body h3{ font-size:22px; color:var(--text-dark); }
  .work-modal-body p{ font-size:14.5px; color:var(--muted-on-cream); font-weight:300; line-height:1.8; }
  .work-modal-body .btn{ align-self:flex-start; margin-top:6px; }
  @media(max-width:900px){ .works-grid{ grid-template-columns:1fr 1fr; } }
  @media(max-width:600px){ .works-grid{ grid-template-columns:1fr; } }

  /* ---------- PACKAGES ---------- */
  .carousel{ position:relative; padding-inline:70px; }
  @media(max-width:600px){
    .carousel{ padding-inline:40px; }
    .carousel-btn{ width:38px; height:38px; }
    .pkg-card{ padding:30px 22px; }
  }
  .carousel-track-wrap{ overflow:hidden; }
  .carousel-track{ display:flex; gap:26px; will-change:transform; transition:transform .55s cubic-bezier(.4,0,.2,1); }
  .pkg-card{
    flex:0 0 min(380px,80vw); background:var(--panel); border-radius:18px; padding:38px 34px;
    display:flex; flex-direction:column; gap:14px; opacity:.35; transform:scale(.92);
    transition:opacity .5s, transform .5s; border:1px solid var(--line-dark);
  }
  .pkg-card.active{ opacity:1; transform:scale(1); }
  .pkg-card h3{ font-size:26px; color:var(--cream); }
  .pkg-card .pkg-en{ font-family:'Playfair Display',serif; font-style:italic; color:var(--gold); font-size:14px; letter-spacing:.3px; }
  .pkg-card .pkg-desc{ font-size:13.5px; color:var(--muted-on-dark); font-weight:300; margin-top:2px; }
  .pkg-list{ display:flex; flex-direction:column; gap:12px; margin-top:10px; }
  .pkg-list li{ display:flex; align-items:flex-start; gap:10px; font-size:13.5px; color:var(--cream); line-height:1.6; }
  .pkg-list li svg{ flex:0 0 auto; width:16px; height:16px; margin-top:3px; color:var(--gold); }
  .pkg-cta{ margin-top:auto; padding-top:14px; }
  .carousel-btn{
    position:absolute; top:50%; transform:translateY(-50%); z-index:10; width:46px; height:46px; border-radius:50%;
    border:1px solid var(--line-dark); background:transparent; display:flex; align-items:center; justify-content:center;
    color:var(--cream); transition:border-color .25s, color .25s;
  }
  .carousel-btn:hover{ border-color:var(--gold); color:var(--gold); }
  .carousel-btn.prev{ inset-inline-start:8px; }
  .carousel-btn.next{ inset-inline-end:8px; }
  .carousel-btn svg{ width:17px; height:17px; }
  [dir="ltr"] .carousel-btn.prev svg, [dir="rtl"] .carousel-btn.next svg{ transform:rotate(180deg); }
  .carousel-dots{ display:flex; justify-content:center; gap:8px; margin-top:34px; }
  .carousel-dots button{ width:7px; height:7px; border-radius:50%; border:0; background:var(--line-dark); padding:0; transition:background .25s, width .25s; }
  .carousel-dots button.active{ background:var(--gold); width:22px; border-radius:5px; }

  /* ---------- CONTACT ---------- */
  .contact-cols{ display:flex; gap:24px; align-items:stretch; flex-wrap:wrap; }
  .contact-info, .contact-form-card{ flex:1 1 320px; background:var(--card-cream); border-radius:16px; padding:36px 32px; box-shadow:0 10px 26px rgba(59,42,29,0.06); }
  .contact-info h3{ font-family:'Tajawal',sans-serif; font-weight:700; font-size:18px; color:var(--text-dark); }
  .contact-info p.lead{ font-size:13.5px; color:var(--muted-on-cream); margin-top:8px; }
  .info-list{ display:flex; flex-direction:column; gap:20px; margin-top:26px; }
  .info-item{ display:flex; align-items:center; gap:14px; }
  .info-icon{ width:42px; height:42px; border-radius:50%; background:var(--cream); display:flex; align-items:center; justify-content:center; flex:0 0 auto; color:var(--gold-deep); }
  .info-icon svg{ width:18px; height:18px; }
  .info-item .label{ font-size:12px; color:var(--muted-on-cream); }
  .info-item .value{ font-size:14.5px; font-weight:600; color:var(--text-dark); margin-top:2px; }
  .form-row{ display:flex; flex-direction:column; gap:8px; margin-bottom:20px; }
  .form-row label{ font-size:13px; color:var(--muted-on-cream); }
  .form-row input, .form-row select, .form-row textarea{
    background:var(--cream); border:1px solid transparent; color:var(--text-dark);
    padding:13px 16px; border-radius:10px; font-size:14.5px; font-family:inherit; font-weight:300; outline:none;
    transition:border-color .25s;
  }
  .form-row input:focus, .form-row select:focus, .form-row textarea:focus{ border-color:var(--gold); }
  .form-row textarea{ resize:vertical; min-height:100px; }
  .form-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  @media(max-width:560px){ .form-grid2{ grid-template-columns:1fr; } }
  .btn-block{ width:100%; }

  /* ---------- CUSTOM DROPDOWN ---------- */
  .custom-select{ position:relative; }
  .cs-trigger{
    width:100%; text-align:start; background:var(--cream); border-radius:10px; padding:13px 16px;
    display:flex; justify-content:space-between; align-items:center; gap:10px;
    border:1px solid transparent; color:var(--text-dark); font-family:inherit; font-size:14.5px; font-weight:300;
    cursor:pointer; transition:border-color .25s;
  }
  .cs-trigger:focus, .cs-trigger.open{ border-color:var(--gold); outline:none; }
  .cs-chevron{ width:15px; height:15px; flex:0 0 auto; color:var(--muted-on-cream); transition:transform .25s; }
  .cs-trigger.open .cs-chevron{ transform:rotate(180deg); }
  .cs-menu{
    position:absolute; top:calc(100% + 8px); inset-inline:0; background:var(--card-cream); border-radius:12px;
    box-shadow:0 16px 34px rgba(59,42,29,.2); padding:6px; list-style:none; margin:0; max-height:240px;
    overflow-y:auto; z-index:60; opacity:0; visibility:hidden; transform:translateY(-6px);
    transition:opacity .2s, transform .2s, visibility .2s;
  }
  .cs-menu.open{ opacity:1; visibility:visible; transform:translateY(0); }
  .cs-menu li{ padding:11px 14px; border-radius:8px; font-size:14px; color:var(--text-dark); cursor:pointer; transition:background .2s, color .2s; }
  .cs-menu li:hover{ background:var(--cream); }
  .cs-menu li.active{ background:var(--cream); color:var(--gold-deep); font-weight:600; }
  .form-note{ font-size:12px; color:var(--muted-on-cream); margin-top:14px; text-align:center; }

  /* ---------- FOOTER ---------- */
  footer{ background:linear-gradient(180deg, var(--panel) 0%, var(--dark-2) 100%); padding:0 0 30px; }
  .footer-top{ display:flex; justify-content:flex-end; padding:22px 0; }
  [dir="ltr"] .footer-top{ justify-content:flex-start; }
  .verified-badge{ display:flex; align-items:center; gap:8px; background:var(--card-cream); border-radius:20px; padding:7px 16px 7px 8px; box-shadow:0 4px 14px rgba(0,0,0,.25); }
  [dir="ltr"] .verified-badge{ padding:7px 8px 7px 16px; }
  .verified-badge img{ width:26px; height:26px; border-radius:50%; }
  .verified-badge span{ font-size:12.5px; font-weight:600; color:var(--text-dark); }
  .footer-grid{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:44px; padding:26px 0 44px; border-top:1px solid var(--line-dark); }
  .footer-col{ display:flex; flex-direction:column; gap:16px; min-width:180px; }
  .footer-col.brand-col{ align-items:flex-start; max-width:290px; }
  .footer-brand{ display:flex; align-items:center; gap:12px; }
  .footer-brand img{ width:52px; height:52px; object-fit:contain; }
  .footer-brand span{ font-size:24px; color:var(--cream); }
  .footer-tagline{ font-size:13px; color:var(--muted-on-dark); font-weight:300; }
  .footer-col.contact-col{ align-items:flex-start; }
  .footer-heading{ font-size:15px; font-weight:700; color:var(--cream); font-family:'Cairo',sans-serif; }
  .social-row{ display:flex; gap:12px; }
  .social-row a{ width:40px; height:40px; border-radius:50%; background:transparent; border:1px solid var(--line-dark); color:var(--cream); display:flex; align-items:center; justify-content:center; transition:background .25s, border-color .25s, color .25s; }
  .social-row a:hover{ background:var(--gold); border-color:var(--gold); color:var(--dark-2); }
  .social-row svg{ width:17px; height:17px; }
  .footer-info-list{ display:flex; flex-direction:column; gap:13px; }
  .footer-info-list li{ display:flex; align-items:center; gap:10px; font-size:13px; color:var(--muted-on-dark); }
  .footer-info-list svg{ width:16px; height:16px; color:var(--gold); flex:0 0 auto; }
  .footer-info-list span{ color:var(--cream); font-weight:500; }
  .footer-col.trust-col{ align-items:center; text-align:center; }
  .trust-badge{ display:flex; align-items:center; gap:8px; font-size:14px; font-weight:600; color:var(--cream); }
  .trust-badge svg{ width:17px; height:17px; color:var(--gold); }
  .footer-legal{ display:flex; flex-direction:column; gap:10px; font-size:13px; color:var(--muted-on-dark); margin-top:4px; }
  .footer-legal a:hover{ color:var(--gold); }
  .footer-col.made-col{ align-items:flex-end; justify-content:center; }
  [dir="rtl"] .footer-col.made-col{ align-items:flex-end; }
  [dir="ltr"] .footer-col.made-col{ align-items:flex-start; }
  .footer-col.made-col img{ width:130px; }
  .footer-bottom{ text-align:center; font-size:12px; color:var(--muted-on-dark); padding-top:22px; border-top:1px solid var(--line-dark); }
  @media(max-width:760px){ .footer-grid{ flex-direction:column; align-items:center; text-align:center; } .footer-col, .footer-col.contact-col, .footer-col.made-col, .footer-col.brand-col{ align-items:center; } }

  /* ---------- BACK TO TOP ---------- */
  .to-top{
    position:fixed; bottom:26px; inset-inline-end:26px; z-index:400; width:48px; height:48px; border-radius:50%;
    background:var(--gold); color:var(--dark-2); display:flex; align-items:center; justify-content:center; border:0;
    opacity:0; visibility:hidden; transform:translateY(12px); box-shadow:0 8px 20px rgba(59,42,29,.25);
    transition:opacity .3s, transform .3s, visibility .3s, background .25s;
    margin-bottom:env(safe-area-inset-bottom,0px);
  }
  .to-top:hover{ background:var(--gold-deep); }
  .to-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
  .to-top svg{ width:20px; height:20px; }

  /* ---------- LEGAL PAGES ---------- */
  .legal-page{ position:fixed; inset:0; z-index:800; background:var(--cream); overflow-y:auto; padding:calc(var(--nav-h) + 30px) 24px 80px; transform:translateY(100%); transition:transform .45s cubic-bezier(.4,0,.2,1); }
  .legal-page.open{ transform:translateY(0); }
  .legal-inner{ max-width:700px; margin:0 auto; }
  .legal-back{ display:inline-flex; align-items:center; gap:8px; color:var(--gold-deep); font-size:14px; font-weight:600; margin-bottom:32px; }
  .legal-back svg{ width:16px; height:16px; }
  [dir="ltr"] .legal-back svg{ transform:rotate(180deg); }
  .legal-inner h1{ font-size:clamp(26px,4vw,36px); color:var(--text-dark); margin-bottom:10px; }
  .legal-updated{ font-size:12.5px; color:var(--muted-on-cream); margin-bottom:36px; font-family:'Tajawal',sans-serif; }
  .legal-inner h2{ font-size:18px; font-weight:700; color:var(--gold-deep); margin-top:30px; margin-bottom:10px; font-family:'Tajawal',sans-serif; }
  .legal-inner p{ color:var(--muted-on-cream); font-size:14.5px; margin-bottom:6px; }

  ::-webkit-scrollbar{ width:8px; }
  ::-webkit-scrollbar-track{ background:var(--cream); }
  ::-webkit-scrollbar-thumb{ background:var(--gold); border-radius:6px; }
  @media (prefers-reduced-motion: reduce){ *{ animation-duration:.001ms !important; transition-duration:.001ms !important; } }

/* صورة العمل داخل البطاقة */
.work-photo{width:100%;height:100%;object-fit:cover;display:block;}
.work-visual{overflow:hidden;}
.work-card .work-visual .work-badge{z-index:2;}

/* سعر الباقة — فوق زر الحجز */
.pkg-price{
  display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
  margin:0 0 12px;padding-top:12px;border-top:1px solid var(--line-dark);
}
.pkg-price .price-old{
  font-family:'Cairo',sans-serif;font-size:15px;color:var(--muted-on-dark);
  text-decoration:line-through;text-decoration-thickness:1.5px;opacity:.75;
}
.pkg-price .price-new{font-family:'Cairo',sans-serif;font-weight:700;font-size:23px;color:var(--gold);}
.pkg-price .price-badge{
  font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:12px;
  background:rgba(199,147,88,.18);color:var(--gold);
}


/* ---------- بيانات التواصل القابلة للنقر ---------- */
.info-item.is-link{
  border-radius:12px;padding:6px;margin:-6px;
  transition:background .2s;
}
.info-item.is-link:hover{background:var(--cream);}
a.contact-link{
  color:var(--text-dark);text-decoration:none;display:inline-block;
  transition:color .2s;
}
a.contact-link:hover{color:var(--gold-deep);text-decoration:underline;}

/* =========================================================
   تحسينات الجوال
   ========================================================= */

/* ---------- الباقات على الجوال: مقاس متناسق ---------- */
@media(max-width:760px){
  .carousel{ padding-inline:0; }
  .carousel-track{ gap:16px; }
  .pkg-card{
    flex:0 0 86vw;
    padding:28px 20px;
    border-radius:16px;
    transform:scale(.96);
  }
  .pkg-card.active{ transform:scale(1); }
  .pkg-card h3{ font-size:22px; }
  .pkg-card .pkg-en{ font-size:13px; }
  .pkg-card .pkg-desc{ font-size:13px; }
  .pkg-list li{ font-size:12.8px; line-height:1.6; }
  .pkg-list li svg{ width:14px; height:14px; margin-top:3px; }

  /* الأسهم تنزل تحت البطاقة بدل أن تقصّها */
  .carousel{
    display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:14px;
  }
  .carousel-track-wrap{ order:1; width:100%; }
  .carousel-btn.prev{ order:2; }
  .carousel-btn.next{ order:3; }
  .carousel-btn{
    position:static; transform:none; width:44px; height:44px; margin-top:16px;
    inset-inline-start:auto; inset-inline-end:auto;
  }
  .carousel-dots{ margin-top:16px; }

  /* السعر فوق زر الحجز */
  .pkg-price{ gap:8px; margin-bottom:10px; padding-top:10px; }
  .pkg-price .price-new{ font-size:20px; }
  .pkg-price .price-old{ font-size:13.5px; }
  .pkg-price .price-badge{ font-size:11px; padding:2px 9px; }
}

/* ---------- الفوتر على الجوال: كل شيء في الوسط ---------- */
@media(max-width:760px){
  footer .footer-grid{
    flex-direction:column; align-items:center; text-align:center; gap:34px;
  }
  footer .footer-col,
  footer .footer-col.brand-col,
  footer .footer-col.contact-col,
  footer .footer-col.trust-col,
  footer .footer-col.made-col{
    align-items:center !important; text-align:center; width:100%; max-width:100%;
  }
  footer .footer-brand{ justify-content:center; }
  footer .footer-tagline{ max-width:280px; margin-inline:auto; }
  footer .footer-info-list{ align-items:center; }
  footer .footer-info-list li{ justify-content:center; text-align:center; }
  footer .social-row{ justify-content:center; }
  footer .footer-legal{ align-items:center; }
  footer .footer-top{ justify-content:center; }
  footer .footer-col.made-col img{ margin-inline:auto; }
}

/* ---------- البار العلوي على الجوال: خلفية واضحة ---------- */
@media(max-width:900px){
  .nav{
    background:#2A1D15 !important;
    border-bottom:1px solid var(--line-dark);
    box-shadow:0 4px 18px rgba(0,0,0,.25);
    backdrop-filter:none !important;
  }
  .nav.scrolled{ background:#2A1D15 !important; }

  /* لوحة القائمة نفسها: خلفية صلبة تماماً تغطي الشاشة */
  .nav-links{
    background:#33231A !important;
    background-image:none !important;
    backdrop-filter:none !important;
    height:100dvh; min-height:100vh;
    padding-top:calc(var(--nav-h) + 40px + env(safe-area-inset-top,0px));
    justify-content:flex-start;
    z-index:600;
  }

  /* طبقة معتمة خلف القائمة — الضغط عليها يغلقها */
  .nav-overlay{
    position:fixed; inset:0; background:rgba(26,17,9,.55);
    z-index:480;                    /* أقل من شريط التنقل (500) حتى لا يغطي الروابط */
    opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s;
  }
  .nav-overlay.show{ opacity:1; visibility:visible; }
}

/* ---------- الموافقة على الشروط والأحكام ---------- */
.form-agree{ position:relative; display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
/* الصندوق الأصلي شفاف فوق الصندوق المزخرف ليبقى قابلاً للتركيز ولرسائل التحقق */
.form-agree input[type="checkbox"]{
  position:absolute; inset-inline-start:0; top:50%; transform:translateY(-50%);
  width:20px; height:20px; margin:0; opacity:0; cursor:pointer;
}
.form-agree label{
  display:inline-flex; align-items:center; gap:10px; cursor:pointer;
  font-size:13px; color:var(--muted-on-cream); line-height:1.6;
}
.agree-box{
  flex:0 0 auto; width:20px; height:20px; border-radius:6px;
  border:1px solid var(--line-cream); background:#fff;
  display:flex; align-items:center; justify-content:center;
  color:#fff; transition:background .18s, border-color .18s;
}
.agree-box svg{ width:13px; height:13px; opacity:0; transition:opacity .18s; }
.form-agree input[type="checkbox"]:checked + label .agree-box{
  background:var(--gold); border-color:var(--gold);
}
.form-agree input[type="checkbox"]:checked + label .agree-box svg{ opacity:1; }
.form-agree input[type="checkbox"]:focus-visible + label .agree-box{
  border-color:var(--gold); box-shadow:0 0 0 3px rgba(199,147,88,.25);
}
.form-agree label:hover .agree-box{ border-color:var(--gold); }
.agree-link{ font-size:13px; color:var(--gold-deep); font-weight:600; }
.agree-link:hover{ text-decoration:underline; }

/* ---------- رسالة حالة النموذج ---------- */
.form-status{
  border-radius:12px; padding:14px 16px; font-size:14px; line-height:1.8;
  margin-bottom:16px; text-align:center; font-weight:500;
}
.form-status.ok{
  background:rgba(63,125,87,.13); color:#2E6B44; border:1px solid rgba(63,125,87,.3);
}
.form-status.warn{
  background:rgba(180,128,31,.13); color:#8a6119; border:1px solid rgba(180,128,31,.3);
}

/* زر زيارة المشروع داخل النافذة */
.work-visit-btn{
  display:inline-flex; align-items:center; gap:7px; align-self:flex-start; margin-top:6px;
  color:var(--text-dark); border:1px solid var(--line-cream);
}
.work-visit-btn:hover{ border-color:var(--gold-deep); color:var(--gold-deep); }

/* ---------- شارة وثيقة العمل الحر في الفوتر ---------- */
.freelance-badge{
  display:flex; align-items:center; gap:11px; margin-top:16px;
  background:var(--card-cream); border-radius:14px; padding:10px 14px;
  box-shadow:0 4px 14px rgba(0,0,0,.22);
  transition:transform .25s, box-shadow .25s;
  max-width:100%;
}
.freelance-badge:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,.3); }
.freelance-badge img{ width:64px; height:auto; flex:0 0 auto; }
.freelance-badge .fl-text{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.freelance-badge .fl-title{
  font-family:'Tajawal',sans-serif; font-weight:700; font-size:12.5px;
  color:var(--text-dark); line-height:1.5;
}
.freelance-badge .fl-sub{
  font-family:'Tajawal',sans-serif; font-weight:400; font-size:11px;
  color:var(--muted-on-cream); line-height:1.5;
}
.freelance-badge[href=""], .freelance-badge:not([href]){ cursor:default; }
@media(max-width:760px){
  .freelance-badge{ margin-inline:auto; }
}

/* ========== أدوات تباعد (بديل الـ inline styles لدعم CSP الصارم) ========== */
.u-mt-6{margin-top:6px}
.u-mt-38{margin-top:38px}
.work-visit-btn svg{width:15px;height:15px}
/* حقل فخ السبام — مخفي عن المستخدم وظاهر للبوتات فقط */
.hp-field{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}