/* ========================================================================
 MR. FOX Digital v1.2.2 — Correcciones puntuales pedidas por el usuario.
 - Hero más abierto y nítido
 - Categories cards más anchas y compactas
 - Contact fox head reemplazada por ilustración limpia y transparente
 ======================================================================== */

:root{--mf-hero-open-left:0.43;}

/* HERO: use the new high-quality panoramic render and keep the full car more visible. */
.mf-hero{min-height:clamp(610px,45vw,780px);background:#030715;overflow:hidden}
.mf-hero-art{inset:0;overflow:hidden}
.mf-hero-art img{
  width:100%;height:100%;object-fit:cover;object-position:54% 52%;
  image-rendering:auto;filter:saturate(1.12) contrast(1.06) brightness(.98);
}
.mf-hero::before{
  background:
    linear-gradient(90deg,rgba(2,7,20,.92) 0%,rgba(2,7,20,.78) 18%,rgba(2,7,20,.24) 43%,rgba(2,7,20,.06) 60%,transparent 72%),
    linear-gradient(180deg,rgba(2,7,20,.06),rgba(2,7,20,.14));
}
.mf-hero-inner{min-height:clamp(610px,45vw,780px);padding:clamp(58px,5vw,94px) 0 152px}
.mf-hero-copy{width:min(600px,44%)}
.mf-hero-title-art{width:min(100%,635px);filter:drop-shadow(0 0 10px rgba(251,43,217,.22))}

/* CATEGORY ROW: wider, tighter and more adaptive depending on amount of items. */
.mf-categories{margin-top:-120px;padding-bottom:10px}
.mf-categories .mf-wrap{width:min(1680px,calc(100% - 22px))}
.mf-category-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(178px,1fr));
  gap:6px;
  align-items:stretch;
}
.mf-category-card{
  min-height:176px;
  padding:20px 10px 18px;
  background:linear-gradient(160deg,rgba(4,12,26,.995),rgba(2,8,18,.995))!important;
  border:1px solid rgba(16,120,166,.34);
  box-shadow:0 18px 30px rgba(0,0,0,.34);
}
.mf-category-card::before{opacity:.5}
.mf-category-card h3{font-size:.86rem}
.mf-category-card p{font-size:.71rem;line-height:1.38}
.mf-category-icon{min-height:66px}
.mf-category-icon img{max-width:115px}

/* CONTACT FOX: clean transparent illustration with true open/closed states. */
.mf-contact-orb__head{width:min(300px,74%);top:10px;aspect-ratio:1/1}
.mf-contact-orb__head img{object-fit:contain;object-position:center center;filter:none!important}
.mf-contact-orb__head .mf-fox-head--closed{animation:mf-fox-actual-blink-v122 7s steps(1,end) infinite}
@keyframes mf-fox-actual-blink-v122{
  0%,5.5%,8.5%,44%,47%,77%,80%,100%{opacity:0}
  6%,8%,45%,79%{opacity:1}
}

@media(min-width:1500px){
  .mf-categories .mf-wrap{width:min(1780px,calc(100% - 22px))}
  .mf-category-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:7px}
  .mf-category-card{min-height:182px}
}
@media(max-width:1200px){
  .mf-hero-copy{width:min(580px,48%)}
  .mf-hero-art img{object-position:58% 52%}
}
@media(max-width:900px){
  .mf-hero-copy{width:55%}
  .mf-category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:760px){
  .mf-hero{min-height:700px}
  .mf-hero-inner{min-height:700px;padding:30px 0 152px}
  .mf-hero-copy{width:100%;max-width:560px}
  .mf-hero-art{inset:210px -26% 0 -22%}
  .mf-hero-art img{object-position:64% 46%}
  .mf-categories{margin-top:-110px}
  .mf-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .mf-category-card{min-height:160px;padding:17px 9px 16px}
  .mf-contact-orb__head{width:min(290px,76%);top:16px}
}
@media(max-width:480px){
  .mf-hero{min-height:640px}
  .mf-hero-inner{min-height:640px;padding:28px 0 138px}
  .mf-hero-copy{max-width:370px}
  .mf-hero-title-art{max-width:390px}
  .mf-hero-art{inset:212px -45% 0 -50%}
  .mf-hero-art img{object-position:60% 49%}
  .mf-categories .mf-wrap{width:calc(100% - 12px)}
  .mf-category-grid{gap:6px}
  .mf-category-card{min-height:154px}
  .mf-category-card h3{font-size:.78rem}
  .mf-category-card p{font-size:.66rem}
  .mf-contact-orb__head{width:min(252px,78%);top:22px}
}
@media(max-width:360px){
  .mf-hero-art{inset:218px -58% 0 -60%}
  .mf-contact-orb__head{width:min(232px,78%);top:28px}
}
