/* CME · Inicio móvil árabe · 12-09-2026 · pulido visual v3
   Recurso EXCLUSIVO del Inicio árabe móvil.
   No modifica escritorio: todo queda aislado a <=900 px y dentro de #mobileHome. */
@media (max-width:900px){
  #mobileHome .m-head-ar-v1,
  #mobileHome .m-brand-row-ar-v1,
  #mobileHome .m-quicknav-ar-v1{overflow:visible}

  #mobileHome .m-head-ar-v1{
    background:#fff;
    border-bottom:1px solid rgba(7,63,50,.09);
    position:relative;
    z-index:120;
  }

  /* Cabecera de identidad: selector a la izquierda y marca a la derecha, pero con un equilibrio más natural para RTL. */
  #mobileHome .m-brand-row-ar-v1{
    min-height:90px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    grid-template-areas:"lang brand";
    align-items:center;
    gap:12px;
    padding:12px 0 8px;
    direction:ltr;
  }
  #mobileHome .m-brand-link-ar-v1{
    grid-area:brand;
    min-width:0;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    gap:6px;
    color:inherit;
    direction:rtl;
  }
  #mobileHome .m-brand-link-ar-v1 .m-logo{
    flex:0 0 56px;
    width:56px;
    height:56px;
    border-radius:15px;
    box-shadow:0 8px 20px rgba(6,63,50,.09);
  }
  #mobileHome .m-brand-link-ar-v1 .m-id{
    min-width:0;
    width:100%;
    text-align:right;
    direction:rtl;
    display:block;
  }
  #mobileHome .m-brand-link-ar-v1 .m-id strong{
    display:block;
    width:100%;
    color:#07513f;
    font:900 17px/1.08 Tahoma,"Segoe UI",Arial,sans-serif;
    text-align:right;
    direction:rtl;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #mobileHome .m-brand-link-ar-v1 .m-spain{
    display:block;
    width:100%;
    margin:4px 0 0;
    color:#a9701f;
    font-size:10px;
    font-weight:800;
    letter-spacing:0;
    direction:rtl;
    text-align:right;
  }
  #mobileHome .m-brand-link-ar-v1 .m-spain:before,
  #mobileHome .m-brand-link-ar-v1 .m-spain:after{display:none}
  #mobileHome .m-brand-link-ar-v1 .m-es{
    display:block;
    width:100%;
    margin-top:3px;
    color:#60756d;
    font:700 10px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;
    direction:ltr;
    text-align:right;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* Selector de idiomas: compacto y estable. */
  #mobileHome .m-top-language-ar-v1{
    grid-area:lang;
    position:relative;
    z-index:320;
    justify-self:start;
    direction:rtl;
  }
  #mobileHome .m-top-language-ar-v1 summary{
    min-width:84px;
    height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:0 10px;
    border:1.5px solid #9bbdaf;
    border-radius:15px;
    background:#fbfdfc;
    color:#07513f;
    cursor:pointer;
    list-style:none;
    font:900 12.5px/1 Tahoma,"Segoe UI",Arial,sans-serif;
    box-shadow:0 3px 10px rgba(7,63,50,.05);
    white-space:nowrap;
  }
  #mobileHome .m-top-language-ar-v1 summary::-webkit-details-marker{display:none}
  #mobileHome .cme-mobile-lang-icon-ar{width:17px;height:17px;display:grid;place-items:center;color:#0a6b54;flex:0 0 17px}
  #mobileHome .cme-mobile-lang-icon-ar svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  #mobileHome .m-lang-chevron-ar-v1{font-size:15px;line-height:1;transition:transform .16s ease;transform-origin:center}
  #mobileHome .m-top-language-ar-v1[open] summary{border-color:#0b6751;background:#eef6f2;box-shadow:0 0 0 3px rgba(11,103,81,.09)}
  #mobileHome .m-top-language-ar-v1[open] .m-lang-chevron-ar-v1{transform:rotate(180deg)}
  #mobileHome .m-top-language-ar-v1 nav{
    position:absolute;
    z-index:340;
    top:50px;
    left:0;
    width:164px;
    padding:6px;
    border:1px solid #d4e1db;
    border-radius:12px;
    background:#fff;
    box-shadow:0 14px 34px rgba(6,47,38,.22);
    direction:rtl;
  }
  #mobileHome .m-top-language-ar-v1 nav a{
    min-height:42px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:8px 10px;
    border-radius:8px;
    color:#123f34;
    font:760 13px/1.2 Tahoma,"Segoe UI",Arial,sans-serif;
  }
  #mobileHome .m-top-language-ar-v1 nav a[aria-current="page"]{background:#eef6f2;color:#07513f}
  #mobileHome .m-top-language-ar-v1 nav a:active{background:#e7f2ed}
  #mobileHome .m-top-language-ar-v1 nav a[hidden],
  #mobileHome .m-top-language-ar-v1 nav a[href*="francais"],
  #mobileHome .m-top-language-ar-v1 nav a[href*="english"]{display:none!important}

  /* Accesos rápidos RTL: estructura 2x2 equilibrada. */
  #mobileHome .m-quicknav-ar-v1{
    position:relative;
    z-index:110;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:
      "account home"
      "menu join";
    gap:1px;
    align-items:stretch;
    margin:7px 6px 8px;
    padding:1px;
    border:1px solid #bfd2cb;
    border-radius:16px;
    background:#cfded8;
    box-shadow:0 6px 18px rgba(6,71,55,.08);
    direction:ltr;
  }
  #mobileHome .m-quick-home-ar-v1{grid-area:home}
  #mobileHome .m-quick-join-ar-v1{grid-area:join}
  #mobileHome .m-quick-login-ar-v1{grid-area:account}
  #mobileHome .m-menu-btn-ar-v1{grid-area:menu}

  #mobileHome .m-quick-ar-v1,
  #mobileHome .m-menu-btn-ar-v1,
  #mobileHome .cme-mobile-home-ar-profile-trigger{
    min-width:0;
    width:100%;
    height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:0 10px;
    border:0;
    border-radius:0;
    box-shadow:none;
    font:850 13.5px/1 Tahoma,"Segoe UI",Arial,sans-serif;
    white-space:nowrap;
    direction:rtl;
  }
  #mobileHome .m-quick-home-ar-v1{color:#064737;background:#edf6f2;border-radius:0 14px 0 0}
  #mobileHome .m-quick-join-ar-v1{color:#805612;background:#fff8e8;border-radius:0 0 14px 0}
  #mobileHome .m-quick-login-ar-v1{color:#07513f;background:#fff;border-radius:14px 0 0 0}
  #mobileHome .m-menu-btn-ar-v1{background:#07513f;color:#fff;cursor:pointer;border-radius:0 0 0 14px}
  #mobileHome .m-hamb-ar-v1{width:18px;display:grid;gap:3px}
  #mobileHome .m-hamb-ar-v1 i{display:block;width:18px;height:2.2px;border-radius:3px;background:#fff}

  /* Perfil/avatar de sesión. */
  #mobileHome .cme-mobile-home-ar-profile-wrap{
    grid-area:account;
    position:relative;
    min-width:0;
    z-index:230;
    direction:rtl;
  }
  #mobileHome .cme-mobile-home-ar-profile-trigger{background:#fff;color:#07513f;cursor:pointer;border-radius:14px 0 0 0}
  #mobileHome .cme-mobile-home-ar-profile-wrap.open .cme-mobile-home-ar-profile-trigger{background:#eef6f2;box-shadow:inset 0 0 0 1px rgba(11,103,81,.18)}
  #mobileHome .cme-mobile-home-ar-avatar{
    flex:0 0 29px;
    width:29px;
    height:29px;
    display:grid;
    place-items:center;
    overflow:hidden;
    border-radius:50%;
    background:#07513f;
    color:#fff;
    font:900 12px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
    box-shadow:0 0 0 1px rgba(7,81,63,.16);
  }
  #mobileHome .cme-mobile-home-ar-avatar img{display:block;width:100%;height:100%;object-fit:cover}
  #mobileHome .cme-mobile-home-ar-account-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #mobileHome .cme-mobile-home-ar-account-caret{flex:0 0 auto;width:15px;height:15px;display:grid;place-items:center;transition:transform .16s ease}
  #mobileHome .cme-mobile-home-ar-account-caret svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  #mobileHome .cme-mobile-home-ar-profile-wrap.open .cme-mobile-home-ar-account-caret{transform:rotate(180deg)}
  #mobileHome .cme-mobile-home-ar-profile-menu{
    position:absolute;
    z-index:260;
    top:calc(100% + 6px);
    left:0;
    width:min(220px,calc(100vw - 24px));
    padding:6px;
    border:1px solid #d6e2dc;
    border-radius:12px;
    background:#fff;
    box-shadow:0 16px 36px rgba(6,47,38,.22);
    text-align:right;
    direction:rtl;
  }
  #mobileHome .cme-mobile-home-ar-profile-menu[hidden]{display:none!important}
  #mobileHome .cme-mobile-home-ar-profile-menu a,
  #mobileHome .cme-mobile-home-ar-profile-menu button{
    width:100%;
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    padding:8px 10px;
    border:0;
    border-radius:8px;
    background:transparent;
    color:#123f34;
    font:750 13px/1.2 Tahoma,"Segoe UI",Arial,sans-serif;
    text-align:right;
    direction:rtl;
    cursor:pointer;
  }
  #mobileHome .cme-mobile-home-ar-profile-menu a:active,
  #mobileHome .cme-mobile-home-ar-profile-menu button:active{background:#eef6f2}
  #mobileHome .cme-mobile-home-ar-profile-menu button{color:#a72a39;border-top:1px solid #edf0ee;margin-top:3px}

  /* Hero adaptado a RTL: zona oscura en la derecha, texto apoyado a la derecha y la imagen respirando a la izquierda. */
  #mobileHome .m-hero{
    position:relative;
    overflow:hidden;
    background:#17353b;
    isolation:isolate;
    margin-top:0;
  }
  #mobileHome .m-hero-bg img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:34% 50%;
  }
  #mobileHome .m-hero:after{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(270deg,rgba(11,38,44,.96) 0%,rgba(15,41,46,.84) 42%,rgba(15,38,41,.30) 68%,rgba(8,24,23,.06) 100%);
  }
  #mobileHome .m-hero .m-shell{
    min-height:470px;
    display:flex;
    align-items:flex-start;
    justify-content:flex-start;
    padding-top:42px;
    padding-bottom:54px;
  }
  #mobileHome .m-hero-copy{
    width:79%;
    max-width:320px;
    color:#fff;
    margin-right:0;
    margin-left:auto;
    text-align:right;
  }
  #mobileHome .m-hero h2{
    margin:0;
    font-size:41px;
    line-height:1.04;
    letter-spacing:-.03em;
    text-shadow:0 2px 5px rgba(0,0,0,.22);
  }
  #mobileHome .m-hero p{
    margin:18px 0 0;
    font-size:16px;
    line-height:1.55;
    text-shadow:0 1px 3px rgba(0,0,0,.35);
  }
  #mobileHome .m-more{
    margin-top:24px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:linear-gradient(135deg,#0a654e,#074c3c);
    color:#fff;
    padding:13px 20px;
    border-radius:12px;
    font-size:14px;
    font-weight:800;
    box-shadow:0 9px 24px rgba(0,0,0,.18);
  }

  /* Menú lateral: abrir desde la izquierda para que el comportamiento quede realmente espejado en árabe móvil. */
  #mobileHome .m-drawer{
    position:fixed!important;
    inset:0!important;
    z-index:2147483000!important;
    visibility:hidden;
    pointer-events:none;
  }
  #mobileHome .m-drawer.open{
    visibility:visible;
    pointer-events:auto;
  }
  #mobileHome .m-shade{
    position:fixed!important;
    inset:0!important;
    z-index:0;
    background:rgba(5,15,12,.52);
    opacity:0;
    transition:opacity .22s;
  }
  #mobileHome .m-drawer.open .m-shade{opacity:1}
  #mobileHome .m-panel{
    position:absolute!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:auto!important;
    z-index:1;
    width:min(89vw,410px);
    height:100dvh!important;
    max-height:100dvh!important;
    background:#fff;
    padding:20px;
    transform:translateX(-102%);
    transition:transform .23s ease;
    box-shadow:15px 0 42px rgba(0,0,0,.18);
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }
  #mobileHome .m-drawer.open .m-panel{transform:none}
  #mobileHome .m-panel-top{
    position:sticky;
    top:-20px;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:-20px -20px 12px;
    padding:20px 20px 12px;
    background:#fff;
    border-bottom:1px solid rgba(7,63,50,.06);
    direction:rtl;
  }
  #mobileHome .m-panel-brand{color:var(--green);font-weight:850;font-size:20px;text-align:right}
  #mobileHome .m-close{width:44px;height:44px;border:0;border-radius:12px;background:#eef4f1;color:var(--green);display:grid;place-items:center;font-size:27px;cursor:pointer}
  #mobileHome .m-navlinks{display:grid;gap:5px;direction:rtl}
  #mobileHome .m-navlinks a{padding:13px 14px;border-radius:11px;font-weight:700;color:#183027;text-align:right}
  #mobileHome .m-account{margin-top:18px;padding-top:18px;border-top:1px solid #e1e6e3;display:grid;grid-template-columns:1fr 1fr;gap:10px}
  #mobileHome .m-account a{padding:12px;border-radius:11px;text-align:center;font-weight:800}
  #mobileHome .m-login{background:#eef5f2;color:var(--green)}
  #mobileHome .m-join{background:var(--green);color:#fff}

  /* La antigua franja de contacto no forma parte de la nueva cabecera y no debe provocar overflow. */
  #mobileHome > .m-contact{display:none!important}
}

@media (max-width:370px){
  #mobileHome .m-brand-row-ar-v1{min-height:82px;gap:8px;padding-top:9px;padding-bottom:6px}
  #mobileHome .m-brand-link-ar-v1{gap:5px}
  #mobileHome .m-brand-link-ar-v1 .m-logo{flex-basis:50px;width:50px;height:50px;border-radius:13px}
  #mobileHome .m-brand-link-ar-v1 .m-id strong{font-size:14.6px}
  #mobileHome .m-brand-link-ar-v1 .m-spain{font-size:9.2px}
  #mobileHome .m-brand-link-ar-v1 .m-es{font-size:8.6px}
  #mobileHome .m-top-language-ar-v1 summary{min-width:74px;height:40px;padding-inline:7px;font-size:11px}
  #mobileHome .m-quicknav-ar-v1{margin-left:4px;margin-right:4px}
  #mobileHome .m-quick-ar-v1,
  #mobileHome .m-menu-btn-ar-v1,
  #mobileHome .cme-mobile-home-ar-profile-trigger{height:46px;padding-inline:6px;font-size:11.5px}
  #mobileHome .cme-mobile-home-ar-avatar{flex-basis:27px;width:27px;height:27px}
  #mobileHome .cme-mobile-home-ar-profile-menu{width:min(204px,calc(100vw - 18px))}
  #mobileHome .m-hamb-ar-v1,
  #mobileHome .m-hamb-ar-v1 i{width:15px}
  #mobileHome .m-hero .m-shell{min-height:438px;padding-top:36px;padding-bottom:46px}
  #mobileHome .m-hero-copy{width:82%;max-width:284px}
  #mobileHome .m-hero h2{font-size:36px}
  #mobileHome .m-hero p{font-size:15px}
}