@media (min-width:1024px){
  /* The base rule targets every descendant span in the cluster. The social icon
     component is itself a nested span, so reset only that inner component. */
  .ir-home-ref-social-cluster > span > .ir-social-icon{
    position:static !important;
    inset:auto !important;
    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;
    display:flex !important;
    width:2rem !important;
    height:2rem !important;
    min-width:2rem !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  .ir-home-ref-social-cluster > span > .ir-social-icon > .ir-social-icon__img{
    position:static !important;
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    margin:0 !important;
    object-fit:contain !important;
    transform:none !important;
  }

  /* Homepage arrows must use the project's directional SVG assets, not text glyphs. */
  .ir-home-ref-category-arrow,
  .ir-home-ref-faq-arrow,
  .ir-home-ref-btn--primary > span{
    display:inline-block;
    width:14px;
    height:14px;
    flex:0 0 14px;
    overflow:hidden;
    color:transparent!important;
    font-size:0!important;
    background-position:center;
    background-repeat:no-repeat;
    background-size:14px 14px;
  }

  .ir-home-ref-category-arrow,
  .ir-home-ref-faq-arrow{
    background-image:url("../icons/ui/arrows/arrow2_down_black.svg");
  }

  .ir-home-ref-btn--primary > span{
    background-image:url("../icons/ui/arrows/arrow2_left_black.svg");
    filter:invert(1);
  }

  .ir-home-ref-btn__services-icon{
    display:inline-flex !important;
    width:18px !important;
    height:18px !important;
    flex:0 0 18px !important;
    align-items:center;
    justify-content:center;
    margin:0 !important;
  }
  .ir-home-ref-btn__services-icon img{
    display:block;
    width:17px;
    height:17px;
    object-fit:contain;
  }

  .ir-home-ref-service-cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    font-size:0!important;
  }
  .ir-home-ref-service-cta::before{
    content:"مشاهده و خرید";
    font-size:11px;
    font-weight:900;
    line-height:1;
  }
  .ir-home-ref-service-cta::after{
    content:"";
    width:14px;
    height:14px;
    flex:0 0 14px;
    background:url("../icons/ui/arrows/arrow2_left_black.svg") center/14px 14px no-repeat;
    filter:invert(1);
  }

  .ir-home-ref-trust-link{
    display:inline-flex;
    align-items:center;
    gap:7px;
    font-size:0!important;
  }
  .ir-home-ref-trust-link::before{
    content:"مشاهده صفحه اعتماد";
    font-size:10px;
    font-weight:800;
  }
  .ir-home-ref-trust-link::after{
    content:"";
    width:13px;
    height:13px;
    flex:0 0 13px;
    background:url("../icons/ui/arrows/arrow2_left_black.svg") center/13px 13px no-repeat;
  }

  /* Why Iranigram: match the supplied reference instead of the simple two-circle version. */
  .ir-home-ref-why-grid{
    display:grid;
    grid-template-columns:430px minmax(0,1fr) !important;
    gap:64px !important;
    align-items:center;
    margin-top:48px !important;
    direction:ltr;
  }

  .ir-home-ref-brand-visual{
    position:relative;
    grid-column:1;
    direction:rtl;
    width:430px;
    min-height:270px;
    height:270px;
    justify-self:start;
    isolation:isolate;
  }

  .ir-home-ref-brand-visual::before{
    content:"";
    position:absolute;
    left:0;
    top:3px;
    z-index:0;
    width:286px;
    height:244px;
    background:url("../image/home/home-brand-halo.svg") center/contain no-repeat;
    pointer-events:none;
  }

  .ir-home-ref-orbit{
    display:none !important;
  }

  .ir-home-ref-brand-logo{
    position:absolute;
    left:88px;
    top:48px;
    z-index:2;
    display:block;
    width:112px;
    height:56px;
    margin:0;
    object-fit:contain;
    object-position:9999px 9999px;
    background:url("../image/home/home-brand-infinity.svg") center/112px 56px no-repeat;
  }

  .ir-home-ref-brand-label{
    position:absolute;
    left:48px;
    bottom:24px;
    z-index:4;
    display:flex;
    width:184px;
    min-width:184px;
    height:82px;
    padding:0 18px;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-radius:15px;
    background:#111a31;
    color:#fff;
    text-align:center;
    box-shadow:0 16px 32px rgba(17,26,49,.20);
  }
  .ir-home-ref-brand-label strong{
    display:block;
    font-size:17px;
    font-weight:950;
    line-height:1.35;
  }
  .ir-home-ref-brand-label span{
    display:block;
    margin-top:6px;
    color:#e7e9ef;
    font-size:10px;
    font-weight:800;
    line-height:1.6;
  }

  .ir-home-ref-mini-fact{
    position:absolute;
    z-index:3;
    display:flex;
    width:126px;
    min-height:59px;
    padding:10px 34px 10px 12px;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    border:1px solid #ece6dc;
    border-radius:14px;
    background:#fff;
    text-align:right;
    box-shadow:0 8px 20px rgba(15,23,42,.05);
  }
  .ir-home-ref-mini-fact::after{
    content:"";
    position:absolute;
    left:12px;
    top:50%;
    width:15px;
    height:15px;
    transform:translateY(-50%);
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
    opacity:.78;
  }
  .ir-home-ref-mini-fact--a::after{background-image:url("../icons/ui/status/star.svg")}
  .ir-home-ref-mini-fact--b::after{background-image:url("../icons/ui/navigation/services.svg")}
  .ir-home-ref-mini-fact--c::after{background-image:url("../icons/ui/actions/24-support.svg")}

  .ir-home-ref-mini-fact strong{
    display:block;
    color:#d88c00;
    font-size:10.5px;
    font-weight:900;
    line-height:1.45;
  }
  .ir-home-ref-mini-fact span{
    display:block;
    margin-top:4px;
    color:#858a94;
    font-size:9.5px;
    line-height:1.45;
  }
  .ir-home-ref-mini-fact--a{right:8px;top:12px}
  .ir-home-ref-mini-fact--b{right:28px;top:86px}
  .ir-home-ref-mini-fact--c{right:2px;top:160px}

  .ir-home-ref-why-copy{
    grid-column:2;
    direction:rtl;
    align-self:center;
    padding-inline-start:8px;
  }
  .ir-home-ref-why-copy h2{
    margin:0;
    color:#151a25;
    font-size:27px !important;
    font-weight:950;
    line-height:1.55;
    letter-spacing:-.55px;
  }
  .ir-home-ref-why-copy>p{
    max-width:640px;
    margin:14px 0 18px;
    color:#656d79;
    font-size:13.5px !important;
    font-weight:600;
    line-height:2.15;
  }
  .ir-home-ref-why-copy ul{
    margin:0;
    padding:0;
    list-style:none;
    display:grid;
    gap:11px;
  }
  .ir-home-ref-why-copy li{
    display:flex;
    align-items:flex-start;
    gap:9px;
    color:#565e69;
    font-size:12.5px !important;
    font-weight:600;
    line-height:1.9;
  }
  .ir-home-ref-why-copy li span{
    display:inline-flex;
    width:19px;
    height:19px;
    align-items:center;
    justify-content:center;
    border:1px solid #f4ad24;
    border-radius:50%;
    color:#e89400;
    font-size:10px;
    flex:0 0 19px;
    margin-top:2px;
  }

  /* Reference-style four-column stats strip. */
  .ir-home-ref-stats{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    align-items:stretch;
    margin-top:24px !important;
    padding:7px 0 !important;
    border:1px solid #efcf94 !important;
    border-radius:18px !important;
    background:#fffdfa !important;
    box-shadow:0 8px 24px rgba(245,158,11,.035);
    overflow:hidden;
    direction:rtl;
  }
  .ir-home-ref-stats .ir-home-ref-stat{
    position:relative;
    display:flex !important;
    min-width:0;
    min-height:92px;
    align-items:center;
    justify-content:center;
    gap:15px;
    padding:12px 22px !important;
    text-align:right !important;
  }
  .ir-home-ref-stats .ir-home-ref-stat + .ir-home-ref-stat::before{
    content:"";
    position:absolute;
    right:0;
    top:19px;
    bottom:19px;
    width:1px;
    background:#eee4d3;
  }
  .ir-home-ref-stat__icon{
    display:flex !important;
    width:48px;
    height:48px;
    flex:0 0 48px;
    align-items:center;
    justify-content:center;
    margin:0 !important;
  }
  .ir-home-ref-stat__icon img{
    display:block;
    width:38px;
    height:38px;
    object-fit:contain;
    filter:invert(67%) sepia(96%) saturate(1090%) hue-rotate(352deg) brightness(101%) contrast(97%);
  }
  .ir-home-ref-stat__copy{
    display:block !important;
    min-width:0;
    margin:0 !important;
  }
  .ir-home-ref-stats .ir-home-ref-stat__copy strong{
    display:block;
    margin:0;
    color:#171c28;
    font-size:25px !important;
    font-weight:950;
    line-height:1.15;
    white-space:nowrap;
  }
  .ir-home-ref-stats .ir-home-ref-stat__copy > span{
    display:block;
    margin:6px 0 0 !important;
    color:#81868f;
    font-size:10px !important;
    font-weight:700;
    line-height:1.5;
    white-space:nowrap;
  }

  html.dark .ir-home-ref-mini-fact{
    border-color:#2c3b4e;
    background:#101b2b;
  }
  html.dark .ir-home-ref-brand-label{
    background:#0d162b;
  }
  html.dark .ir-home-ref-why-copy h2{color:#f8fafc}
  html.dark .ir-home-ref-why-copy>p,
  html.dark .ir-home-ref-why-copy li{color:#a9b3c1}
  html.dark .ir-home-ref-stats{
    border-color:#59421d !important;
    background:#101b2b !important;
  }
  html.dark .ir-home-ref-stats .ir-home-ref-stat + .ir-home-ref-stat::before{background:#2b3545}
  html.dark .ir-home-ref-stats .ir-home-ref-stat__copy strong{color:#f8fafc}
  html.dark .ir-home-ref-stats .ir-home-ref-stat__copy > span{color:#9ca3af}
  html.dark .ir-home-ref-btn__services-icon img{filter:invert(1)}
}

@media (min-width:1024px) and (max-width:1199px){
  .ir-home-ref-why-grid{
    grid-template-columns:360px minmax(0,1fr) !important;
    gap:38px !important;
  }
  .ir-home-ref-brand-visual{
    width:360px;
    transform:scale(.9);
    transform-origin:left center;
  }
  .ir-home-ref-why-copy h2{font-size:24px !important}
  .ir-home-ref-why-copy>p{font-size:12.5px !important}
  .ir-home-ref-why-copy li{font-size:11.5px !important}
  .ir-home-ref-stats .ir-home-ref-stat{gap:10px;padding:10px 12px !important}
  .ir-home-ref-stat__icon{width:42px;height:42px;flex-basis:42px}
  .ir-home-ref-stat__icon img{width:34px;height:34px}
  .ir-home-ref-stats .ir-home-ref-stat__copy strong{font-size:21px !important}
  .ir-home-ref-stats .ir-home-ref-stat__copy > span{font-size:9px !important}
}

/* On very wide desktop, widen the shell itself and center a 3-column hero grid.
   This keeps the hero truly centered without pushing the service rail outside
   the viewport. */
@media (min-width:1440px){
  .ir-home-ref-shell{
    width:min(100%,1440px) !important;
  }

  .ir-home-ref-hero-grid{
    width:100%;
    max-width:1438px;
    margin-inline:auto;
    grid-template-columns:340px minmax(0,710px) 340px !important;
    grid-template-areas:"side hero spacer" !important;
    justify-content:center;
    column-gap:24px !important;
    position:static !important;
    left:auto !important;
    transform:none !important;
  }

  .ir-home-ref-side-stack{
    justify-self:end;
  }

  .ir-home-ref-hero-main{
    width:100%;
    max-width:710px;
    justify-self:center !important;
  }
}
