/* T78 — Mobile homepage polish
   - Restores the real service icons (calendar / bed / dining)
   - Keeps the Arabic hero title fully visible, including dots and letter tops
   - Refines the gold tone and shimmer without changing desktop or inner pages
*/

@keyframes t78GoldSweep{
  0%,18%{background-position:120% 50%;}
  42%,100%{background-position:-30% 50%;}
}

@media (max-width:760px){
  /* Prevent Arabic dots and ascenders from being clipped. */
  #home .hero-content{
    overflow:visible !important;
  }

  #home .hero h1{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 auto 4px !important;
    padding:9px 10px 10px !important;
    overflow:visible !important;
    white-space:nowrap !important;
    box-sizing:border-box !important;
    font-family:"Tajawal","Cairo",sans-serif !important;
    font-size:clamp(2.18rem,9.7vw,2.92rem) !important;
    font-weight:900 !important;
    line-height:1.22 !important;
    letter-spacing:-.018em !important;
    text-rendering:geometricPrecision !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    background-image:linear-gradient(108deg,
      #d69624 0%,
      #edb947 19%,
      #ffd977 35%,
      #fff1ad 47%,
      #f4c95f 58%,
      #d99a28 78%,
      #f7d879 100%) !important;
    background-size:245% 100% !important;
    animation:t78GoldSweep 7.2s ease-in-out infinite !important;
    filter:
      drop-shadow(0 7px 15px rgba(0,0,0,.76))
      drop-shadow(0 0 8px rgba(239,187,70,.20)) !important;
  }

  /* Real icons instead of the flat gold blocks. */
  #home .feature-card .icon{
    width:48px !important;
    height:48px !important;
    flex:0 0 48px !important;
    margin:0 auto 3px !important;
    background-color:transparent !important;
    background-repeat:no-repeat !important;
    background-position:center !important;
    background-size:contain !important;
    -webkit-mask:none !important;
    mask:none !important;
    filter:
      drop-shadow(0 6px 10px rgba(0,0,0,.48))
      drop-shadow(0 0 8px rgba(241,195,84,.16)) !important;
  }

  #home .feature-card .icon-calendar{
    background-image:url('assets/ui/calendar.png') !important;
  }

  #home .feature-card .icon-hotel{
    width:54px !important;
    background-image:url('assets/ui/bed.png') !important;
  }

  #home .feature-card .icon-menu{
    width:42px !important;
    background-image:url('assets/ui/fork-knife.png') !important;
  }

  #home .feature-card strong{
    color:#f0bf50 !important;
    text-shadow:
      0 4px 11px rgba(0,0,0,.58),
      0 0 5px rgba(238,187,69,.08) !important;
  }
}

@media (max-width:760px) and (max-height:780px){
  #home .hero h1{
    font-size:clamp(1.98rem,8.8vw,2.38rem) !important;
    line-height:1.24 !important;
    padding-top:7px !important;
    padding-bottom:8px !important;
  }

  #home .feature-card .icon{
    width:38px !important;
    height:38px !important;
    flex-basis:38px !important;
  }
  #home .feature-card .icon-hotel{width:44px !important;}
  #home .feature-card .icon-menu{width:34px !important;}
}

@media (max-width:380px){
  #home .hero h1{
    font-size:1.98rem !important;
    letter-spacing:-.01em !important;
  }
}

@media (prefers-reduced-motion:reduce){
  #home .hero h1{
    animation:none !important;
    background-position:50% 50% !important;
  }
}